var Ht = Object.defineProperty;
var Gt = (t, e, r) =>
  e in t
    ? Ht(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r })
    : (t[e] = r);
var u = (t, e, r) => (Gt(t, typeof e != "symbol" ? e + "" : e, r), r);
import {
  f as p,
  c as Oe,
  p as _e,
  v as Ce,
  a as Xt,
  b as pe,
  g as Vt,
  s as Yt,
  d as zt,
  l as ne,
  e as jt,
  h as Ut,
  u as $t,
  r as o,
  i as _,
  j as w,
  k as c,
  F as U,
  S as Zt,
  P as qt,
  m as Kt,
  X as Jt,
  _ as Qt,
  n as ft,
  o as Ne,
  q as $e,
  t as Ze,
  w as er,
  x as tr,
  y as rr,
  z as ar,
  R as nr,
} from "./vendor.9e161471.js";
(function () {
  const e = document.createElement("link").relList;
  if (e && e.supports && e.supports("modulepreload")) return;
  for (const n of document.querySelectorAll('link[rel="modulepreload"]')) a(n);
  new MutationObserver((n) => {
    for (const s of n)
      if (s.type === "childList")
        for (const i of s.addedNodes)
          i.tagName === "LINK" && i.rel === "modulepreload" && a(i);
  }).observe(document, { childList: !0, subtree: !0 });
  function r(n) {
    const s = {};
    return (
      n.integrity && (s.integrity = n.integrity),
      n.referrerpolicy && (s.referrerPolicy = n.referrerpolicy),
      n.crossorigin === "use-credentials"
        ? (s.credentials = "include")
        : n.crossorigin === "anonymous"
        ? (s.credentials = "omit")
        : (s.credentials = "same-origin"),
      s
    );
  }
  function a(n) {
    if (n.ep) return;
    n.ep = !0;
    const s = r(n);
    fetch(n.href, s);
  }
})();
const ce = (t, e) => Math.floor(Math.random() * (e - t + 1)) + t,
  we = (t) => (t && typeof t == "string" ? `${t}` : ""),
  Xe = (t, e) => Math.sqrt(Math.pow(t.x - e.x, 2) + Math.pow(t.y - e.y, 2)),
  Ve = () =>
    /phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone|Mobi|Android|iPhone|iPad/i.test(
      navigator.userAgent
    );
let Fe = !1,
  Me = Ve();
class sr {
  constructor() {
    u(this, "canvas", null);
  }
  initCanvas(e) {
    (this.canvas = e), this._initBrushMouse();
  }
  _initBrushMouse() {
    p.fabric.util.object.extend(this.canvas, {
      _onMouseDownInDrawingMode: function () {},
      _onMouseMoveInDrawingMode: function (e) {
        Me ||
          (Fe
            ? p.fabric.Canvas.prototype._onMouseMoveInDrawingMode.call(this, e)
            : ((Fe = !0),
              p.fabric.Canvas.prototype._onMouseDownInDrawingMode.call(
                this,
                e
              )));
      },
      _onMouseUpInDrawingMode: function (e) {
        Me ||
          ((Fe = !1),
          p.fabric.Canvas.prototype._onMouseUpInDrawingMode.call(this, e));
      },
    });
  }
  updateIsDisableDraw(e) {
    Me = e;
  }
}
const wt = new sr();
class or {
  constructor() {
    u(this, "openAlignGuideLine", !0);
  }
  updateOpenState(e) {
    this.openAlignGuideLine = e;
  }
  init(e, r) {
    const a = e.getSelectionContext(),
      n = 5,
      s = 4,
      i = 1,
      d = "rgb(102, 204, 138)";
    let h,
      g = 1;
    this.openAlignGuideLine = r;
    function m(x) {
      L(
        x.x + 0.5,
        x.y1 > x.y2 ? x.y2 : x.y1,
        x.x + 0.5,
        x.y2 > x.y1 ? x.y2 : x.y1
      );
    }
    function C(x) {
      L(
        x.x1 > x.x2 ? x.x2 : x.x1,
        x.y + 0.5,
        x.x2 > x.x1 ? x.x2 : x.x1,
        x.y + 0.5
      );
    }
    function L(x, S, I, T) {
      h != null &&
        (a.save(),
        (a.lineWidth = i),
        (a.strokeStyle = d),
        a.beginPath(),
        a.moveTo(x * g + h[4], S * g + h[5]),
        a.lineTo(I * g + h[4], T * g + h[5]),
        a.stroke(),
        a.restore());
    }
    function b(x, S) {
      (x = Math.round(x)), (S = Math.round(S));
      for (let I = x - s, T = x + s; I <= T; I++) if (I === S) return !0;
      return !1;
    }
    const y = [],
      v = [];
    e.on("mouse:down", () => {
      (h = e.viewportTransform), (g = e.getZoom());
    }),
      e.on("object:moving", (x) => {
        if (h === void 0 || x.target === void 0 || !this.openAlignGuideLine)
          return;
        const S = x.target,
          I = e.getObjects(),
          T = S.getCenterPoint(),
          E = T.x,
          M = T.y,
          j = S.getBoundingRect(),
          V = j.height / h[3],
          R = j.width / h[0];
        let P = !1,
          F = !1;
        if (!!e._currentTransform) {
          for (let $ = I.length; $--; ) {
            if (I[$] === S) continue;
            const Q = I[$].getCenterPoint(),
              B = Q.x,
              D = Q.y,
              se = I[$].getBoundingRect(),
              X = se.height / h[3],
              Y = se.width / h[0];
            b(B, E) &&
              ((F = !0),
              y.push({
                x: B,
                y1: D < M ? D - X / 2 - n : D + X / 2 + n,
                y2: M > D ? M + V / 2 + n : M - V / 2 - n,
              }),
              S.setPositionByOrigin(
                new p.fabric.Point(B, M),
                "center",
                "center"
              )),
              b(B - Y / 2, E - R / 2) &&
                ((F = !0),
                y.push({
                  x: B - Y / 2,
                  y1: D < M ? D - X / 2 - n : D + X / 2 + n,
                  y2: M > D ? M + V / 2 + n : M - V / 2 - n,
                }),
                S.setPositionByOrigin(
                  new p.fabric.Point(B - Y / 2 + R / 2, M),
                  "center",
                  "center"
                )),
              b(B + Y / 2, E + R / 2) &&
                ((F = !0),
                y.push({
                  x: B + Y / 2,
                  y1: D < M ? D - X / 2 - n : D + X / 2 + n,
                  y2: M > D ? M + V / 2 + n : M - V / 2 - n,
                }),
                S.setPositionByOrigin(
                  new p.fabric.Point(B + Y / 2 - R / 2, M),
                  "center",
                  "center"
                )),
              b(D, M) &&
                ((P = !0),
                v.push({
                  y: D,
                  x1: B < E ? B - Y / 2 - n : B + Y / 2 + n,
                  x2: E > B ? E + R / 2 + n : E - R / 2 - n,
                }),
                S.setPositionByOrigin(
                  new p.fabric.Point(E, D),
                  "center",
                  "center"
                )),
              b(D - X / 2, M - V / 2) &&
                ((P = !0),
                v.push({
                  y: D - X / 2,
                  x1: B < E ? B - Y / 2 - n : B + Y / 2 + n,
                  x2: E > B ? E + R / 2 + n : E - R / 2 - n,
                }),
                S.setPositionByOrigin(
                  new p.fabric.Point(E, D - X / 2 + V / 2),
                  "center",
                  "center"
                )),
              b(D + X / 2, M + V / 2) &&
                ((P = !0),
                v.push({
                  y: D + X / 2,
                  x1: B < E ? B - Y / 2 - n : B + Y / 2 + n,
                  x2: E > B ? E + R / 2 + n : E - R / 2 - n,
                }),
                S.setPositionByOrigin(
                  new p.fabric.Point(E, D + X / 2 - V / 2),
                  "center",
                  "center"
                ));
          }
          P || (v.length = 0), F || (y.length = 0);
        }
      }),
      e.on("before:render", () => {
        try {
          e.clearContext(e.contextTop);
        } catch (x) {
          console.log(x);
        }
      }),
      e.on("after:render", () => {
        for (let x = y.length; x--; ) m(y[x]);
        for (let x = v.length; x--; ) C(v[x]);
        (y.length = 0), (v.length = 0);
      }),
      e.on("mouse:up", () => {
        (y.length = 0), (v.length = 0), e.renderAll();
      });
  }
}
const xt = new or(),
  z = { DRAW: "draw", ERASE: "erase", SELECT: "select", Board: "board" },
  ir = {
    IMAGE: "image",
    I_TEXT: "itext",
    RAINBOW: "rainbow",
    SHAPE: "shape",
    PIXELS: "pixels",
    DRAW_TEXT: "drawText",
    MULTI_LINE: "multiLine",
    RETICULATE: "reticulate",
    MULTI_POINT: "multiPoint",
    WIGGLE: "wiggle",
    THORN: "thorn",
  },
  Ye = {
    SHAPE_LINE: "shapeLine",
    SHAPE_RECT: "shapeRect",
    SHAPE_CIRCLE: "shapeCircle",
    SHAPE_ELLIPSE: "shapeEllipse",
    SHAPE_TRIANGLE: "shapeTriangle",
    SHAPE_ARROW_LINE: "shapeArrowLine",
    SHAPE_ARROW_OUTLINE: "shapeArrowOutline",
    SHAPE_CLOUD: "shapeCloud",
    SHAPE_TOOLTIPS: "shapeTooltips",
    SHAPE_LIGHTNING: "shapeLightning",
    SHAPE_CLOSE: "shapeClose",
    SHAPE_CHECK: "shapeCheck",
    SHAPE_INFO: "shapeInfo",
    SHAPE_BACKSPACE: "shapeBackspace",
    SHAPE_BLOCK: "shapeBlock",
    SHAPE_SPEAKER: "shapeSpeaker",
    SHAPE_SEARCH: "shapeSearch",
    SHAPE_INFO_OUTLINE: "shapeInfoOutline",
    SHAPE_HEART: "shapeHeart",
    SHAPE_ALERT: "shapeAlert",
  },
  A = { ...ir, ...Ye },
  ge = { FreeStyle: "freeStyle", Shape: "shape" },
  k = {
    Basic: "basic",
    Rainbow: "rainbow",
    Shape: "shape",
    Material: "material",
    Pixels: "pixels",
    MultiColor: "multiColor",
    Text: "text",
    MultiLine: "multiLine",
    Reticulate: "reticulate",
    MultiPoint: "multiPoint",
    Wiggle: "wiggle",
    Thorn: "thorn",
  },
  q = {
    Bubble: "bubble",
    Star: "star",
    Love: "love",
    Butterfly: "butterfly",
    Snow: "snow",
    Music: "music",
    Sun: "sun",
    Moon: "moon",
    Leaf: "leaf",
    Flower: "flower",
  };
function qe(t, e = 1) {
  const r = parseInt(t.slice(1), 16),
    a = (r >> 16) & 255,
    n = (r >> 8) & 255,
    s = r & 255;
  return `rgba(${a}, ${n}, ${s}, ${e})`;
}
function cr(t) {
  if (!t) return t;
  const e = t.match(/\d+/g);
  return `#${(
    (1 << 24) +
    (parseInt(e[0]) << 16) +
    (parseInt(e[1]) << 8) +
    parseInt(e[2])
  )
    .toString(16)
    .slice(1)}`;
}
function Ke(t) {
  const e = t.match(/rgba?\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/);
  return e ? parseFloat(e[4]) : 1;
}
function lr(t, e) {
  const r = t.match(/rgba?\((.*?)\)/);
  if (!r) return t;
  const a = r[1].split(",").map((s) => s.trim());
  return (
    (e = Math.min(1, Math.max(0, e))), `rgba(${a[0]}, ${a[1]}, ${a[2]}, ${e})`
  );
}
function dr(t) {
  return /^#([0-9A-Fa-f]{3}){1,2}$/.test(t);
}
function hr(t) {
  return /^rgba?\((\d+,\s*){2}\d+,\s*(0(\.\d+)?|1(\.0)?)\)$/.test(t);
}
function pr(t) {
  return dr(t) ? "hex" : hr(t) ? "rgba" : "unknown";
}
const ve = (t = !0) => {
    var r, a;
    const e =
      (r = l == null ? void 0 : l.canvas) == null ? void 0 : r.backgroundImage;
    e && (Ct(e), t && ((a = l.canvas) == null || a.requestRenderAll()));
  },
  ur = (t) => {
    const e = l.canvas;
    !e ||
      p.fabric.Image.fromURL(
        t,
        (r) => {
          Ct(r),
            e.setBackgroundImage(r, () => {
              l.render();
            });
        },
        { crossOrigin: "anonymous" }
      );
  },
  Ct = (t) => {
    const e = l == null ? void 0 : l.canvas;
    if (!e) return;
    const r = e.getWidth(),
      a = e.getHeight(),
      n = t.width,
      s = t.height,
      i = r / n,
      d = a / s,
      h = Math.min(i, d);
    t.scale(h);
    const g = r / 2 - (n * h) / 2,
      m = a / 2 - (s * h) / 2;
    t.set({
      left: g,
      top: m,
      originX: "left",
      originY: "top",
      opacity: O.getState().backgroundImageOpacity,
    });
  },
  gr = "zh",
  O = Oe()(
    _e(
      (t, e) => ({
        mode: z.DRAW,
        drawType: ge.FreeStyle,
        language: gr,
        canvasWidth: 1,
        canvasHeight: 1,
        backgroundColor: "rgba(255, 255, 255, 1)",
        backgroundOpacity: 1,
        hasBackgroundImage: !1,
        backgroundImageOpacity: 1,
        isObjectCaching: !0,
        openGuideLine: !1,
        updateMode: (r) => {
          e().mode !== r && (l.handleMode(r), t({ mode: r }));
        },
        updateDrawType: (r) => {
          e().drawType !== r && (t({ drawType: r }), l.handleMode());
        },
        updateLanguage(r) {
          t({ language: r });
        },
        initBackground: () => {
          var n, s;
          const r =
            (n = l == null ? void 0 : l.canvas) == null
              ? void 0
              : n.backgroundColor;
          if (r && typeof r == "string") {
            const i = pr(r);
            if (i === "hex") {
              const d = qe(r),
                h = Ke(d);
              t({ backgroundColor: d, backgroundOpacity: h });
            } else if (i === "rgba") {
              const d = Ke(r);
              t({ backgroundColor: r, backgroundOpacity: d });
            }
          } else
            l != null &&
              l.canvas &&
              ((l.canvas.backgroundColor = "rgba(255, 255, 255, 1)"),
              t({
                backgroundColor: "rgba(255, 255, 255, 1)",
                backgroundOpacity: 1,
              }));
          const a =
            (s = l == null ? void 0 : l.canvas) == null
              ? void 0
              : s.backgroundImage;
          a
            ? (ve(),
              t({ hasBackgroundImage: !0, backgroundOpacity: a.opacity }))
            : t({ hasBackgroundImage: !1, backgroundOpacity: 1 });
        },
        updateCanvasWidth: (r) => {
          e().canvasWidth !== r &&
            (t({ canvasWidth: r }), l.updateCanvasWidth(r));
        },
        updateCanvasHeight: (r) => {
          e().canvasHeight !== r &&
            (t({ canvasHeight: r }), l.updateCanvasHeight(r));
        },
        updateBackgroundColor: (r) => {
          const a = l.canvas;
          a &&
            r !== (a == null ? void 0 : a.backgroundColor) &&
            t((n) => {
              const s = qe(r, n.backgroundOpacity);
              return (a.backgroundColor = s), { backgroundColor: s };
            });
        },
        updateBackgroundOpacity: (r) => {
          t((a) => {
            const n = l.canvas;
            if (n && r !== a.backgroundOpacity) {
              const s = lr(a.backgroundColor, r);
              return (
                (n.backgroundColor = s),
                { backgroundOpacity: r, backgroundColor: s }
              );
            }
            return {};
          });
        },
        updateBackgroundImage: (r) => {
          const a = l.canvas,
            n = a == null ? void 0 : a.backgroundImage;
          a &&
            r !== (n == null ? void 0 : n.src) &&
            (ur(r), t({ hasBackgroundImage: !0 }));
        },
        cleanBackgroundImage: () => {
          t({ hasBackgroundImage: !1 });
          const r = l.canvas;
          r &&
            r.setBackgroundImage(null, () => {
              l.render();
            });
        },
        updateBackgroundImageOpacity: (r) => {
          t((a) => {
            const n = l.canvas;
            if (n && r !== a.backgroundImageOpacity) {
              const s = n == null ? void 0 : n.backgroundImage;
              return s && s.set({ opacity: r }), { backgroundImageOpacity: r };
            }
            return {};
          });
        },
        updateCacheState() {
          var a;
          const r = e().isObjectCaching;
          t({ isObjectCaching: !r }),
            p.fabric.Object.prototype.set({
              objectCaching: O.getState().isObjectCaching,
            }),
            (a = l == null ? void 0 : l.canvas) == null || a.renderAll();
        },
        updateOpenGuideLine() {
          const r = !e().openGuideLine;
          t({ openGuideLine: r }), xt.updateOpenState(r);
        },
      }),
      { name: "PAINT-BOARD-STORE" }
    )
  ),
  mr = {
    getItem: async (t) => (await Vt(t)) || null,
    setItem: async (t, e) => {
      await Yt(t, e);
    },
    removeItem: async (t) => {
      await zt(t);
    },
  },
  Je = Ce(),
  Ie = "1.5.7",
  ie = Oe()(
    _e(
      (t, e) => ({
        currentId: Je,
        files: [
          {
            id: Je,
            title: "默认画板",
            boardVersion: Ie,
            boardData: {},
            zoom: 1,
            canvasWidth: 1,
            canvasHeight: 1,
          },
        ],
        updateCurrentFile(r) {
          const a = e().currentId;
          r !== a && t({ currentId: r });
        },
        updateTitle(r, a) {
          var i;
          const n = e().files,
            s = n == null ? void 0 : n.findIndex((d) => d.id === a);
          ((i = n == null ? void 0 : n[s]) == null ? void 0 : i.title) !== r &&
            t(
              pe((d) => {
                d.files[s].title = r;
              })
            );
        },
        updateBoardData(r) {
          const a = e().files,
            n = a == null ? void 0 : a.findIndex((s) => s.id === e().currentId);
          t(
            pe((s) => {
              (s.files[n].boardVersion = Ie), (s.files[n].boardData = r);
            })
          );
        },
        updateZoom(r) {
          const a = e().files,
            n = a == null ? void 0 : a.findIndex((s) => s.id === e().currentId);
          n > -1 &&
            t(
              pe((s) => {
                s.files[n].zoom = r;
              })
            );
        },
        updateTransform(r) {
          const a = e().files,
            n = a == null ? void 0 : a.findIndex((s) => s.id === e().currentId);
          n > -1 &&
            t(
              pe((s) => {
                s.files[n].viewportTransform = r;
              })
            );
        },
        updateCanvasWidth(r) {
          const a = e().files,
            n = a == null ? void 0 : a.findIndex((s) => s.id === e().currentId);
          n > -1 &&
            t(
              pe((s) => {
                s.files[n].canvasWidth = r;
              })
            );
        },
        updateCanvasHeight(r) {
          const a = e().files,
            n = a == null ? void 0 : a.findIndex((s) => s.id === e().currentId);
          n > -1 &&
            t(
              pe((s) => {
                s.files[n].canvasHeight = r;
              })
            );
        },
        addFile() {
          const r = Ce();
          t(
            pe((a) => {
              a.files.unshift({
                id: r,
                title: "新画板",
                boardVersion: Ie,
                boardData: {},
                zoom: 1,
                canvasWidth: O.getState().canvasWidth,
                canvasHeight: O.getState().canvasHeight,
              });
            })
          );
        },
        deleteFile() {
          const r = e().files;
          if (r.length > 1) {
            const a =
              r == null ? void 0 : r.findIndex((n) => n.id === e().currentId);
            t(
              pe((n) => {
                n.files.splice(a, 1), (n.currentId = n.files[0].id);
              })
            );
          }
        },
        saveJSON() {
          var a;
          const r =
            (a = e().files) == null
              ? void 0
              : a.find((n) => n.id === e().currentId);
          if (r) {
            const n = JSON.stringify(r),
              s = new Blob([n], { type: "application/json" }),
              i = document.createElement("a");
            (i.href = URL.createObjectURL(s)),
              (i.download = "paint-board.json"),
              i.click(),
              URL.revokeObjectURL(i.href);
          }
        },
        uploadFile(r) {
          return new Promise((a) => {
            if (r) {
              const n = new FileReader();
              (n.onload = (s) => {
                var h;
                const i = (h = s.target) == null ? void 0 : h.result;
                let d = !1;
                if (i) {
                  const g = JSON.parse(i);
                  if (
                    (g == null ? void 0 : g.boardData) &&
                    (g == null ? void 0 : g.title)
                  ) {
                    const m = Ce();
                    t(
                      pe((C) => {
                        C.files.unshift({
                          id: m,
                          title: g == null ? void 0 : g.title,
                          boardVersion:
                            (g == null ? void 0 : g.boardVersion) || Ie,
                          boardData: g == null ? void 0 : g.boardData,
                          canvasWidth:
                            (g == null ? void 0 : g.canvasWidth) || 1,
                          canvasHeight:
                            (g == null ? void 0 : g.canvasHeight) || 1,
                        }),
                          (C.currentId = C.files[0].id);
                      })
                    ),
                      (d = !0);
                  }
                }
                a(d);
              }),
                (n.onerror = (s) => {
                  console.log("reader fail", s), a(!1);
                }),
                n.readAsText(r);
            } else a(!1);
          });
        },
      }),
      { name: "PAINT-BOARD-FILES", storage: Xt(() => mr) }
    )
  );
function vt(t) {
  const e = new p.fabric.Point(
    t.strokeUniform ? 1 / t.scaleX : 1,
    t.strokeUniform ? 1 / t.scaleY : 1
  ).multiply(t.strokeWidth);
  return new p.fabric.Point(t.width + e.x, t.height + e.y);
}
const bt = function (t, e, r) {
    var i;
    const a = r.points,
      n = a[this.pointIndex].x - r.pathOffset.x,
      s = a[this.pointIndex].y - r.pathOffset.y;
    return p.fabric.util.transformPoint(
      { x: n, y: s },
      p.fabric.util.multiplyTransformMatrices(
        (i = r.canvas) == null ? void 0 : i.viewportTransform,
        r.calcTransformMatrix()
      )
    );
  },
  St = function (t, e, r, a) {
    const n = e.target,
      s = n.controls[n.__corner],
      i = n.toLocalPoint(new p.fabric.Point(r, a), "center", "center"),
      d = vt(n),
      h = n._getTransformedDimensions(0, 0),
      g = {
        x: (i.x * d.x) / h.x + n.pathOffset.x,
        y: (i.y * d.y) / h.y + n.pathOffset.y,
      },
      m = n.points;
    return (m[s.pointIndex] = g), !0;
  };
function yt(t, e) {
  return function (r, a, n, s) {
    const i = a.target,
      d = i.points,
      h = p.fabric.util.transformPoint(
        { x: d[t].x - i.pathOffset.x, y: d[t].y - i.pathOffset.y },
        i.calcTransformMatrix()
      ),
      g = e(r, a, n, s);
    i._setPositionDimensions({});
    const m = vt(i),
      C = (d[t].x - i.pathOffset.x) / m.x,
      L = (d[t].y - i.pathOffset.y) / m.y;
    return i.setPositionByOrigin(h, C + 0.5, L + 0.5), g;
  };
}
function kt(t, e, r, a, n) {
  const s = Math.atan2(n - r, a - e),
    i = 10,
    d = a - i * Math.cos(s - Math.PI / 6),
    h = n - i * Math.sin(s - Math.PI / 6),
    g = a - i * Math.cos(s + Math.PI / 6),
    m = n - i * Math.sin(s + Math.PI / 6);
  return (
    (t[t.length - 4][1] = a),
    (t[t.length - 4][2] = n),
    (t[t.length - 3][1] = d),
    (t[t.length - 3][2] = h),
    (t[t.length - 2][1] = a),
    (t[t.length - 2][2] = n),
    (t[t.length - 1][1] = g),
    (t[t.length - 1][2] = m),
    t
  );
}
function Lt(t) {
  const e = new p.fabric.Point(
    t.strokeUniform ? 1 / t.scaleX : 1,
    t.strokeUniform ? 1 / t.scaleY : 1
  ).multiply(t.strokeWidth);
  return new p.fabric.Point(t.width + e.x, t.height + e.y);
}
const Et = function (t, e, r) {
    var i;
    const a = r.path,
      n = a[this.pointIndex][1] - r.pathOffset.x,
      s = a[this.pointIndex][2] - r.pathOffset.y;
    return p.fabric.util.transformPoint(
      { x: n, y: s },
      p.fabric.util.multiplyTransformMatrices(
        (i = r.canvas) == null ? void 0 : i.viewportTransform,
        r.calcTransformMatrix()
      )
    );
  },
  Mt = function (t, e, r, a) {
    const n = e.target,
      s = n.controls[n.__corner],
      i = n.toLocalPoint(new p.fabric.Point(r, a), "center", "center"),
      d = Lt(n),
      h = n._getTransformedDimensions(0, 0),
      g = {
        x: (i.x * d.x) / h.x + n.pathOffset.x,
        y: (i.y * d.y) / h.y + n.pathOffset.y,
      },
      m = n.path;
    if (
      ((m[s.pointIndex][1] = g.x),
      (m[s.pointIndex][2] = g.y),
      s.pointIndex === (m == null ? void 0 : m.length) - 5 ||
        s.pointIndex === (m == null ? void 0 : m.length) - 6)
    ) {
      const C = m[m.length - 6],
        L = m[m.length - 5],
        b = kt(m, C[1], C[2], L[1], L[2]);
      n._setPath(b);
    }
    return !0;
  };
function It(t, e) {
  return function (r, a, n, s) {
    const i = a.target,
      d = i.path,
      h = p.fabric.util.transformPoint(
        { x: d[t][1] - i.pathOffset.x, y: d[t][2] - i.pathOffset.y },
        i.calcTransformMatrix()
      ),
      g = e(r, a, n, s);
    i._setPath(i.path);
    const m = Lt(i),
      C = (d[t][1] - i.pathOffset.x) / m.x,
      L = (d[t][2] - i.pathOffset.y) / m.y;
    return i.setPositionByOrigin(h, C + 0.5, L + 0.5), g;
  };
}
const De = () => {
    var e;
    const t = l == null ? void 0 : l.canvas;
    return t
      ? (e = t.toDatalessJSON([
          "id",
          "_customType",
          "perPixelTargetFind",
          "objectCaching",
        ])) != null
        ? e
        : {}
      : {};
  },
  We = (t) => {
    t.getObjects().forEach((e) => {
      if (e._customType === A.SHAPE_LINE) {
        const r = e.points,
          a = r.length - 1;
        e.controls = r.reduce(function (n, s, i) {
          return (
            (n["p" + i] = new p.fabric.Control({
              positionHandler: bt,
              actionHandler: yt(i > 0 ? i - 1 : a, St),
              actionName: "polylineEndPoint",
              pointIndex: i,
            })),
            n
          );
        }, {});
      }
      if (e._customType === A.SHAPE_ARROW_LINE) {
        const r = e.path;
        e.controls = r.slice(0, r.length - 4).reduce(function (a, n, s) {
          return (
            (a["p" + s] = new p.fabric.Control({
              positionHandler: Et,
              actionHandler: It(s > 0 ? s - 1 : r.length - 5, Mt),
              actionName: "pathEndPoint",
              pointIndex: s,
            })),
            a
          );
        }, {});
      }
    });
  },
  fr = {};
class wr {
  constructor() {
    u(this, "diffs", []);
    u(this, "canvasData", {});
    u(this, "index", 0);
    if (l.canvas) {
      const r = De();
      this.canvasData = ne.exports.cloneDeep(r != null ? r : {});
    }
  }
  saveState() {
    if (l == null ? void 0 : l.canvas) {
      this.diffs = this.diffs.slice(0, this.index);
      const r = De(),
        a = jt(r, this.canvasData);
      this.diffs.push(a),
        this.diffs.length > 50 ? this.diffs.shift() : this.index++,
        (this.canvasData = ne.exports.cloneDeep(r != null ? r : {})),
        ie.getState().updateBoardData(r);
    }
  }
  undo() {
    const e = l == null ? void 0 : l.canvas;
    if (e && this.index > 0) {
      const r = this.diffs[this.index - 1];
      this.index--;
      const a = Ut(this.canvasData, r);
      e.loadFromJSON(a, () => {
        We(e),
          e.requestRenderAll(),
          ie.getState().updateBoardData(a),
          (this.canvasData = ne.exports.cloneDeep(a != null ? a : {})),
          l.triggerHook(),
          r != null && r.backgroundImage && ve();
      });
    }
  }
  redo() {
    const e = l == null ? void 0 : l.canvas;
    if (this.index < this.diffs.length && e) {
      const r = this.diffs[this.index];
      this.index++;
      const a = $t(this.canvasData, r);
      e.loadFromJSON(a, () => {
        We(e),
          e.requestRenderAll(),
          ie.getState().updateBoardData(a),
          (this.canvasData = ne.exports.cloneDeep(a != null ? a : {})),
          l.triggerHook(),
          r != null && r.backgroundImage && ve();
      });
    }
  }
  clean() {
    var e;
    (e = l == null ? void 0 : l.canvas) == null || e.clear(),
      (this.index = 0),
      (this.diffs = []),
      (this.canvasData = {}),
      ie.getState().updateBoardData(fr),
      O.getState().updateBackgroundColor("#ffffff"),
      O.getState().cleanBackgroundImage();
  }
  initHistory() {
    if (l.canvas) {
      const r = De();
      (this.canvasData = r), (this.index = 0), (this.diffs = []);
    }
  }
}
const N = {
    Line: "line",
    Rect: "rect",
    Circle: "cricle",
    Ellipse: "ellipse",
    Triangle: "triangle",
    ArrowLine: "arrowLine",
    ArrowOutline: "arrowOutline",
    Cloud: "cloud",
    Tooltips: "tooltips",
    Lightning: "lightning",
    Close: "close",
    Check: "check",
    Info: "info",
    Backspace: "backspace",
    Block: "block",
    Speaker: "speaker",
    Search: "search",
    InfoOutline: "infoOutline",
    Heart: "heart",
    Alert: "alert",
  },
  ue = { Transparent: "transparent", Full: "full" },
  xr = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M4 12L20 12",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  Cr = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705739078408,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 5340,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 20,
        height: 20,
        ...t,
      },
      o.exports.createElement("path", {
        fill: "currentColor",
        d: "M0 480h160v64H0zM288 480H448v64H288zM576 480h160v64H576zM864 480H1024v64h-160z",
        "p-id": 5341,
      })
    ),
  vr = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        xmlns: "http://www.w3.org/2000/svg",
        fill: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M3 13H1v-2h2zm4-2H5v2h2zm12 0h-2v2h2zm4 0h-2v2h2zm-12 0H9v2h2zm4 0h-2v2h2z",
        }),
        o.exports.createElement("path", { fill: "none", d: "M0 0h24v24H0z" })
      )
    ),
  ae = { Solid: "solid", Dashed: "dashed", Dotted: "dotted" },
  Ae = {
    line_1: [
      { type: ae.Solid, icon: xr },
      { type: ae.Dashed, icon: Cr },
      { type: ae.Dotted, icon: vr },
    ],
  },
  ke = (t) => {
    var e, r;
    return (
      (t != null ? t : f.getState().drawWidth) /
      ((r = (e = l.canvas) == null ? void 0 : e.getZoom()) != null ? r : 1)
    );
  },
  ze = (t) => {
    var e, r;
    return (
      (t != null ? t : f.getState().eraserWidth) /
      ((r = (e = l.canvas) == null ? void 0 : e.getZoom()) != null ? r : 1)
    );
  },
  Le = (t) => {
    var e, r;
    return (
      (t != null ? t : f.getState().shadowWidth) /
      ((r = (e = l.canvas) == null ? void 0 : e.getZoom()) != null ? r : 1)
    );
  },
  be = () => {
    var a, n;
    const { lineType: t, drawWidth: e } = f.getState(),
      r = (n = (a = l.canvas) == null ? void 0 : a.getZoom()) != null ? n : 1;
    switch (t) {
      case ae.Dashed:
        return [(e / r) * 3, (e / r) * 2];
      case ae.Dotted:
        return [(e / r) * 0.5, (e / r) * 1.25];
      default:
        return;
    }
  };
function de(t, e, r, a) {
  const n = r / 2,
    s = [];
  for (let i = 0; i < a; i++) {
    const d = Math.floor(t - n + Math.random() * r),
      h = Math.floor(e - n + Math.random() * r);
    s.push({ x: d, y: h });
  }
  return s;
}
const Z = {
  CRAYON: "crayon",
  CARBON: "carbon",
  CLOTH: "cloth",
  OIL: "oil",
  CRAYON_DARK: "crayonDark",
};
class br {
  constructor() {
    u(this, "initPromise", null);
    u(this, "crayonImage", null);
    u(this, "carbonImage", null);
    u(this, "clothImage", null);
    u(this, "oilImage", null);
    u(this, "crayonDarkImage", null);
    this.initMaterial();
  }
  async initMaterial() {
    this.initPromise = Promise.all([
      this.loadImage(Z.CRAYON),
      this.loadImage(Z.CARBON),
      this.loadImage(Z.CLOTH),
      this.loadImage(Z.OIL),
      this.loadImage(Z.CRAYON_DARK),
    ]);
  }
  render({
    materialType: e = f.getState().materialType,
    color: r = f.getState().drawColors[0],
  }) {
    var a;
    (a = this.initPromise) == null ||
      a.then(() => {
        switch (e) {
          case Z.CRAYON:
            this.renderMaterial(this.crayonImage, r);
            break;
          case Z.CARBON:
            this.renderMaterial(this.carbonImage, r);
            break;
          case Z.CLOTH:
            this.renderMaterial(this.clothImage, r);
            break;
          case Z.OIL:
            this.renderMaterial(this.oilImage, r);
            break;
          case Z.CRAYON_DARK:
            this.renderMaterial(this.crayonDarkImage, r);
            break;
        }
      });
  }
  renderMaterial(e, r, a = 1) {
    if (l.canvas) {
      const n = new p.fabric.PatternBrush(l.canvas),
        s = document.createElement("canvas");
      s.width = s.height = 100;
      const i = s.getContext("2d");
      i &&
        ((i.fillStyle = r),
        i.fillRect(0, 0, 100, 100),
        e && ((i.globalAlpha = a), i.drawImage(e, 0, 0, 100, 100))),
        (n.getPatternSrc = () => s),
        (n.getPatternSrcFunction = () => s),
        (l.canvas.freeDrawingBrush = n),
        (l.canvas.freeDrawingBrush.width = ke());
      const d = be();
      (l.canvas.freeDrawingBrush.strokeDashArray = d),
        (l.canvas.freeDrawingBrush.shadow = new p.fabric.Shadow({
          blur: Le(),
          offsetX: 0,
          offsetY: 0,
          color: f.getState().shadowColor,
        }));
    }
  }
  loadImage(e) {
    return new Promise((r) => {
      const a = new Image();
      (a.src = we(`pattern/${e}.png`)),
        (a.onload = () => {
          switch (e) {
            case Z.CARBON:
              this.carbonImage = a;
              break;
            case Z.CRAYON:
              this.crayonImage = a;
              break;
            case Z.CLOTH:
              this.clothImage = a;
              break;
            case Z.OIL:
              this.oilImage = a;
              break;
            case Z.CRAYON_DARK:
              this.crayonDarkImage = a;
              break;
          }
          r(!0);
        }),
        (a.onerror = () => {
          r(!1);
        });
    });
  }
}
const He = new br(),
  xe = 5,
  he = { COL: "col", ROW: "row", CIRCLE: "circle" },
  Ge = (t) => {
    var d, h;
    const e = l.canvas;
    if (!e) return;
    const r =
        (d = t == null ? void 0 : t.colors) != null
          ? d
          : f.getState().drawColors,
      a =
        (h = t == null ? void 0 : t.type) != null
          ? h
          : f.getState().multiColorType,
      n = new p.fabric.PatternBrush(e),
      s = document.createElement("canvas"),
      i = s.getContext("2d");
    if (i) {
      switch (a) {
        case he.COL:
          Sr(s, i, r);
          break;
        case he.ROW:
          yr(s, i, r);
          break;
        case he.CIRCLE:
          kr(s, i, r);
          break;
      }
      (n.getPatternSrc = () => s),
        (n.getPatternSrcFunction = () => s),
        (e.isDrawingMode = !0),
        (e.freeDrawingBrush = n),
        (e.freeDrawingBrush.width = ke());
      const g = be();
      (e.freeDrawingBrush.strokeDashArray = g),
        (e.freeDrawingBrush.shadow = new p.fabric.Shadow({
          blur: Le(),
          offsetX: 0,
          offsetY: 0,
          color: f.getState().shadowColor,
        }));
    }
  };
function Sr(t, e, r) {
  (t.width = xe * r.length),
    (t.height = 20),
    r.forEach((a, n) => {
      (e.fillStyle = a), e.fillRect(xe * n, 0, xe, 20);
    });
}
function yr(t, e, r) {
  (t.width = 20),
    (t.height = xe * r.length),
    r.forEach((a, n) => {
      (e.fillStyle = a), e.fillRect(0, xe * n, 20, xe);
    });
}
function kr(t, e, r) {
  const s = r.length,
    i = 2 * 5 + s * 10 * 2 + (s - 1) * 5;
  (t.width = i), (t.height = 10 * 2 + 2 * 5);
  let d = 5 + 10;
  const h = 5 + 10;
  for (let g = 0; g < s; g++)
    e.beginPath(),
      (e.fillStyle = r[g]),
      e.arc(d, h, 10, 0, Math.PI * 2),
      e.closePath(),
      e.fill(),
      (d += 2 * 10 + 5);
}
const f = Oe()(
    _e(
      (t, e) => ({
        drawWidth: 10,
        drawColors: ["#000000"],
        lineType: ae.Solid,
        shadowWidth: 0,
        shadowColor: "#000000",
        drawTextValue: "draw",
        drawStyle: k.Basic,
        drawShapeCount: 2,
        materialType: Z.CRAYON,
        drawShape: q.Bubble,
        eraserWidth: 20,
        multiColorType: he.COL,
        textFontFamily: "Georgia",
        fontStyles: [],
        updateDrawWidth(r) {
          var s;
          const { drawWidth: a, drawStyle: n } = e();
          a !== r &&
            l.canvas &&
            ((l.canvas.freeDrawingBrush.width = ke(r)),
            t({ drawWidth: r }),
            [k.Basic, k.Material, k.MultiColor].includes(n) &&
              ((s = l.canvas) == null ? void 0 : s.freeDrawingBrush) &&
              (l.canvas.freeDrawingBrush.strokeDashArray = be()));
        },
        updateDrawColors: (r) => {
          t((a) => {
            switch (a.drawStyle) {
              case k.Basic:
                l.canvas && (l.canvas.freeDrawingBrush.color = r[0]);
                break;
              case k.Material:
                a.drawColors[0] !== r[0] && He.render({});
                break;
              case k.MultiColor:
                Ge({ colors: r });
                break;
            }
            return { drawColors: r };
          });
        },
        updateLineType(r) {
          var s;
          const { lineType: a, drawStyle: n } = e();
          a !== r &&
            (t({ lineType: r }),
            [k.Basic, k.Material, k.MultiColor].includes(n) &&
              ((s = l.canvas) == null ? void 0 : s.freeDrawingBrush) &&
              (l.canvas.freeDrawingBrush.strokeDashArray = be()));
        },
        updateShadowWidth: (r) => {
          t(
            () => (
              l.canvas && (l.canvas.freeDrawingBrush.shadow.blur = Le(r)),
              { shadowWidth: r }
            )
          );
        },
        updateShadowColor: (r) => {
          t(
            () => (
              l.canvas && (l.canvas.freeDrawingBrush.shadow.color = r),
              { shadowColor: r }
            )
          );
        },
        updateDrawShape: (r) => t({ drawShape: r }),
        updateDrawStyle: (r) => {
          t({ drawStyle: r }), l.handleDrawStyle();
        },
        updateDrawShapeCount: (r) => t({ drawShapeCount: r }),
        updateDrawTextValue: (r) => t({ drawTextValue: r }),
        updateMaterialType(r) {
          t(
            (a) => (
              a.materialType !== r && He.render({ materialType: r }),
              { materialType: r }
            )
          );
        },
        updateEraserWidth(r) {
          t(
            (a) => (
              a.drawWidth !== r &&
                l.canvas &&
                (l.canvas.freeDrawingBrush.width = ze(r)),
              { eraserWidth: r }
            )
          );
        },
        updateMultiColorType(r) {
          t(
            (a) => (
              a.multiColorType !== r && Ge({ type: r }), { multiColorType: r }
            )
          );
        },
        updateTextFontFamily(r) {
          t({ textFontFamily: r });
        },
        updateFontStyles(r) {
          const a = [...e().fontStyles],
            n = a.findIndex((s) => s === r);
          n !== -1 ? a.splice(n, 1) : a.push(r), t({ fontStyles: a });
        },
      }),
      { name: "PAINT-BOARD-DRAW-STORE" }
    )
  ),
  G = (t, e) => {
    const r = Ce();
    t.set({ id: r, _customType: e });
  };
class Lr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "points", []);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.RETICULATE);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = Date.now();
    if (r - this.lastTime < 30) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    this.points.push(a),
      !(this.points.length < 2) &&
        (this.group.addWithUpdate(Er(this.points)),
        (n = l.canvas) == null || n.requestRenderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Er(t) {
  var s, i, d, h;
  const e = f.getState().drawColors[0],
    r = Math.ceil(
      f.getState().drawWidth /
        3 /
        ((i = (s = l.canvas) == null ? void 0 : s.getZoom()) != null ? i : 1)
    ),
    a = [];
  a.push(
    new p.fabric.Line(
      [
        t[t.length - 1].x,
        t[t.length - 1].y,
        t[t.length - 2].x,
        t[t.length - 2].y,
      ],
      { stroke: e, strokeWidth: r }
    )
  );
  const n =
    1e3 / ((h = (d = l.canvas) == null ? void 0 : d.getZoom()) != null ? h : 1);
  for (let g = 0; g < t.length; g = g + 1) {
    const m = t[g].x - t[t.length - 1].x,
      C = t[g].y - t[t.length - 1].y;
    m * m + C * C < n &&
      a.push(
        new p.fabric.Line(
          [
            t[t.length - 1].x + m * 0.1,
            t[t.length - 1].y + C * 0.1,
            t[g].x - m * 0.1,
            t[g].y - C * 0.1,
          ],
          { stroke: e, strokeWidth: r / 3 }
        )
      );
  }
  return new p.fabric.Group(a);
}
function Mr(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const s = ce(e * 0.3, e * 1),
      i = (t == null ? void 0 : t.x) - s,
      d = (t == null ? void 0 : t.y) - s;
    return new p.fabric.Circle({
      left: i,
      top: d,
      radius: s,
      opacity: Math.random(),
      fill: f.getState().drawColors[0],
    });
  }
  const a = de(
    t == null ? void 0 : t.x,
    t == null ? void 0 : t.y,
    e * 3,
    f.getState().drawShapeCount
  ).map((s, i) => {
    const d = ce(e * 0.3, e),
      h =
        i > f.getState().drawColors.length - 1
          ? f.getState().drawColors[0]
          : f.getState().drawColors[i];
    return new p.fabric.Circle({
      left: s.x,
      top: s.y,
      radius: d,
      opacity: Math.random(),
      fill: h,
    });
  });
  return new p.fabric.Group(a);
}
function Ir(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = Qe(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = Qe(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function Qe(t) {
  const e = ce(t, t * 2) * 2,
    r = e * (9 / 10),
    a = r / 2,
    n = e / 2,
    s = Math.PI / 5,
    i = [];
  for (let h = 0; h < 10; h++) {
    const g = h % 2 === 0 ? r / 2 : r / 4,
      m = a + g * Math.cos(h * s),
      C = n + g * Math.sin(h * s);
    i.push({ x: m, y: C });
  }
  return new p.fabric.Polygon(i, { opacity: Math.random() });
}
function Tr(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = et(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = et(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function et(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M20.808,11.079C19.829,16.132,12,20.5,12,20.5s-7.829-4.368-8.808-9.421C2.227,6.1,5.066,3.5,8,3.5a4.444,4.444,0,0,1,4,2,4.444,4.444,0,0,1,4-2C18.934,3.5,21.773,6.1,20.808,11.079Z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Pr(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = tt(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = tt(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function tt(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M214.37 208H70.57c-31 0-57.37 14.9-67.26 45.33C1.57 258.71 0 265.54 0 272c0 48 96 128 144 128 28.95 0 53.24-10.67 75.72-33.14-8.58 11.05-13.81 23.47-15.72 37.28-6.98 49.25 1.73 83.2 27.23 91.48C255.99 503.66 288 512 304 512c48 0 53.35-109.18 26.33-144.39L214.37 208zm29.29-21.28L288.1 49.96C297.68 20.47 320 0 352 0c5.66 0 12.64.62 18.78 2.61 45.65 14.84 92.07 130.86 77.23 176.51-8.94 27.54-26.59 47.34-54.91 61.77 13.15-4.74 26.59-5.88 40.31-3.42 49 8.58 78.59 27.35 78.59 54.16 0 26.04-1.96 59.05-6.91 74.27-14.83 45.65-120.32 17.01-145.46-19.58l-115.97-159.6z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Rr(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = rt(e);
    return (
      r.set({
        left: t.x - e,
        top: t.y - e,
        stroke: f.getState().drawColors[0],
        strokeWidth: 2,
      }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = rt(e);
      return h.set({ left: s.x, top: s.y, stroke: d, strokeWidth: 2 }), h;
    });
    return new p.fabric.Group(a);
  }
}
function rt(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M11.9994 3V7M11.9994 7V17M11.9994 7L8.99943 4M11.9994 7L14.9994 4M11.9994 17V21M11.9994 17L8.99943 20M11.9994 17L14.9994 20M4.20624 7.49999L7.67034 9.49999M7.67034 9.49999L16.3306 14.5M7.67034 9.49999L3.57227 10.5981M7.67034 9.49999L6.57227 5.40191M16.3306 14.5L19.7947 16.5M16.3306 14.5L17.4287 18.5981M16.3306 14.5L20.4287 13.4019M4.2067 16.5L7.6708 14.5M7.6708 14.5L16.3311 9.49999M7.6708 14.5L3.57273 13.4019M7.6708 14.5L6.57273 18.5981M16.3311 9.49999L19.7952 7.49999M16.3311 9.49999L17.4291 5.40192M16.3311 9.49999L20.4291 10.5981",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Nr(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = at(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = at(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function at(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M10.0909 11.9629L19.3636 8.63087V14.1707C18.8126 13.8538 18.1574 13.67 17.4545 13.67C15.4964 13.67 13.9091 15.096 13.9091 16.855C13.9091 18.614 15.4964 20.04 17.4545 20.04C19.4126 20.04 21 18.614 21 16.855C21 16.855 21 16.8551 21 16.855L21 7.49236C21 6.37238 21 5.4331 20.9123 4.68472C20.8999 4.57895 20.8852 4.4738 20.869 4.37569C20.7845 3.86441 20.6352 3.38745 20.347 2.98917C20.2028 2.79002 20.024 2.61055 19.8012 2.45628C19.7594 2.42736 19.716 2.39932 19.6711 2.3722L19.6621 2.36679C18.8906 1.90553 18.0233 1.93852 17.1298 2.14305C16.2657 2.34086 15.1944 2.74368 13.8808 3.23763L11.5963 4.09656C10.9806 4.32806 10.4589 4.52419 10.0494 4.72734C9.61376 4.94348 9.23849 5.1984 8.95707 5.57828C8.67564 5.95817 8.55876 6.36756 8.50501 6.81203C8.4545 7.22978 8.45452 7.7378 8.45455 8.33743V16.1307C7.90347 15.8138 7.24835 15.63 6.54545 15.63C4.58735 15.63 3 17.056 3 18.815C3 20.574 4.58735 22 6.54545 22C8.50355 22 10.0909 20.574 10.0909 18.815C10.0909 18.815 10.0909 18.8151 10.0909 18.815L10.0909 11.9629Z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Ar(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = nt(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = nt(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function nt(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M23.395 14.106c2.958-1.383 2.828-6.068 5.758-5.884-4.125-2.74-4.019 3.106-9.089 1.235 1.107-3.068-2.292-6.286-0.091-8.227-4.855 0.979-0.645 5.039-5.555 7.301-1.384-2.958-6.068-2.828-5.884-5.758-2.74 4.125 3.106 4.019 1.235 9.089-3.068-1.107-6.286 2.292-8.227 0.091 0.979 4.855 5.039 0.645 7.301 5.555-2.958 1.384-2.828 6.068-5.758 5.884 4.125 2.74 4.019-3.106 9.089-1.235-1.107 3.068 2.292 6.286 0.091 8.227 4.855-0.979 0.645-5.039 5.555-7.301 1.384 2.958 6.068 2.828 5.884 5.758 2.74-4.125-3.106-4.019-1.235-9.089 3.068 1.107 6.286-2.292 8.226-0.091-0.979-4.855-5.039-0.645-7.301-5.555z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Or(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = st(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = st(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function st(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M8.23129 2.24048C9.24338 1.78695 10.1202 2.81145 9.80357 3.70098C8.72924 6.71928 9.38932 10.1474 11.6193 12.3765C13.8606 14.617 17.3114 15.2755 20.3395 14.1819C21.2206 13.8637 22.2173 14.7319 21.7817 15.7199C21.7688 15.7491 21.7558 15.7782 21.7427 15.8074C20.9674 17.5266 19.7272 19.1434 18.1227 20.2274C16.4125 21.3828 14.3957 22.0001 12.3316 22.0001H12.3306C9.93035 21.9975 7.6057 21.1603 5.75517 19.6321C3.90463 18.1039 2.64345 15.9797 2.18793 13.6237C1.73241 11.2677 2.11094 8.82672 3.2586 6.71917C4.34658 4.72121 6.17608 3.16858 8.20153 2.25386L8.23129 2.24048Z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function _r(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = ot(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = ot(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function ot(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M15.362,9.69c0,0-0.75,1.108-1.068,0c-0.318-1.109-1.346-4.949-1.762-5.226 c-0.417-0.278-0.417-0.278-0.417-0.278s-0.078,1.506-0.594,1.307c-0.515-0.198-4.313-2.217-4.63-2.652L6.574,2.444 c0,0,0.355,3.328-0.515,2.615c0,0,1.113,2.771-2.573,3.048c0,0,1.186,3.087,4.552,4.75c0,0,1.148,1.783-0.949,1.503 c0,0-2.932-0.395-3.325-0.752c0,0-1.548,3.01-3.764,3.128c0,0,2.656,1.504,2.337,4.156c0,0,5.107,0.041,4.911,0.832 c-0.2,0.795-0.555,1.601-0.555,1.601s4.71-0.929,5.422-2.194c0,0,0.989,0.99,1.071,1.939c0,0,2.693-0.594,2.452-2.296 c0,0,1.269,0.948,1.427,2.551l0.554-0.375c0,0-0.319-1.661-1.464-2.967c0,0-0.517-1.308,0.789-0.633c0,0,3.085,1.029,5.7-0.833 c0,0-2.888-0.948-3.006-1.978c0,0,5.394-3.326,5.625-5.542c0,0-1.944,0.198-2.972-0.633c0,0-1.309-0.396,0.394-4.791 c0,0-1.227,0.724-1.62-3.636c0,0-3.051,4.665-4.518,3.082C16.548,5.018,15.165,8.066,15.362,9.69z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
function Br(t, e) {
  if (f.getState().drawShapeCount === 1) {
    const r = it(e);
    return (
      r.set({ left: t.x - e, top: t.y - e, fill: f.getState().drawColors[0] }),
      r
    );
  } else {
    const a = de(
      t == null ? void 0 : t.x,
      t == null ? void 0 : t.y,
      e * 3,
      f.getState().drawShapeCount
    ).map((s, i) => {
      const d =
          i > f.getState().drawColors.length - 1
            ? f.getState().drawColors[0]
            : f.getState().drawColors[i],
        h = it(e);
      return h.set({ left: s.x, top: s.y, fill: d }), h;
    });
    return new p.fabric.Group(a);
  }
}
function it(t) {
  const e = ce(t * 1.5, t * 3),
    r =
      "M512,224.438c0-63.766-51.703-115.469-115.484-115.469c-8.781,0-17.328,1-25.531,2.859 C365.656,52.984,316.219,6.875,256,6.875c-60.234,0-109.672,46.109-114.984,104.953c-8.219-1.859-16.766-2.859-25.531-2.859 C51.703,108.969,0,160.672,0,224.438c0,47.594,28.797,88.469,69.906,106.141c-10.297,17.281-16.234,37.484-16.234,59.063 c0,63.766,51.703,115.484,115.484,115.484c34.625,0,65.672-15.266,86.844-39.406c21.156,24.141,52.219,39.406,86.844,39.406 c63.781,0,115.484-51.719,115.484-115.484c0-21.578-5.938-41.781-16.25-59.063C483.203,312.906,512,272.031,512,224.438z M256,372.531c-53.563,0-97-43.406-97-97c0-53.563,43.438-96.984,97-96.984s96.984,43.422,96.984,96.984 C352.984,329.125,309.563,372.531,256,372.531z",
    a = new p.fabric.Path(r, { opacity: Math.random() }),
    n = a.getBoundingRect(),
    s = e / n.width,
    i = e / n.height,
    d = Math.min(s, i);
  return a.scale(d), a;
}
class Fr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.SHAPE);
  }
  addPosition(e) {
    var i, d, h;
    const r = Date.now();
    if (r - this.lastTime < 30 || !e) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y),
      n =
        f.getState().drawWidth /
        ((d =
          (i = l == null ? void 0 : l.canvas) == null ? void 0 : i.getZoom()) !=
        null
          ? d
          : 1);
    let s = null;
    switch (f.getState().drawShape) {
      case q.Bubble:
        s = Mr(a, n);
        break;
      case q.Star:
        s = Ir(a, n);
        break;
      case q.Love:
        s = Tr(a, n);
        break;
      case q.Butterfly:
        s = Pr(a, n);
        break;
      case q.Snow:
        s = Rr(a, n);
        break;
      case q.Music:
        s = Nr(a, n);
        break;
      case q.Sun:
        s = Ar(a, n);
        break;
      case q.Moon:
        s = Or(a, n);
        break;
      case q.Leaf:
        s = _r(a, n);
        break;
      case q.Flower:
        s = Br(a, n);
        break;
    }
    s &&
      (this.group.addWithUpdate(s),
      (h = l.canvas) == null || h.requestRenderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
class Dr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.PIXELS);
  }
  addPosition(e) {
    var n;
    const r = Date.now();
    if (r - this.lastTime < 30 || !e) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    this.group.addWithUpdate(Wr(a.x, a.y)),
      (n = l.canvas) == null || n.requestRenderAll();
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Wr(t, e) {
  var s, i, d, h, g, m;
  const r = [],
    a = Number(
      (
        f.getState().drawWidth /
        ((i =
          (s = l == null ? void 0 : l.canvas) == null ? void 0 : s.getZoom()) !=
        null
          ? i
          : 1)
      ).toFixed(2)
    ),
    n = Number(
      (
        f.getState().drawWidth /
        3 /
        ((h =
          (d = l == null ? void 0 : l.canvas) == null ? void 0 : d.getZoom()) !=
        null
          ? h
          : 1)
      ).toFixed(2)
    );
  for (let C = -a; C < a; C += n)
    for (let L = -a; L < a; L += n)
      if (Math.random() > 0.5) {
        const b =
            (m =
              (g = f.getState().drawColors) == null
                ? void 0
                : g[ce(0, f.getState().drawColors.length - 1)]) != null
              ? m
              : f.getState().drawColors[0],
          y = new p.fabric.Rect({
            left: t + C,
            top: e + L,
            width: n,
            height: n,
            fill: b,
          });
        r.push(y);
      }
  return new p.fabric.Group(r);
}
const Hr = 3;
class Gr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "points", []);
    u(this, "group");
    u(this, "counter", 0);
    u(this, "position", { x: 0, y: window.innerHeight / 2 });
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.DRAW_TEXT);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = new p.fabric.Point(e.x, e.y);
    if ((this.points.push(r), this.points.length < 2)) {
      this.position = { x: r.x, y: r.y };
      return;
    }
    const a = Date.now();
    a - this.lastTime < 30 ||
      ((this.lastTime = a),
      this.group.addWithUpdate(Xr(this)),
      (n = l.canvas) == null || n.requestRenderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Xr(t) {
  const e = t.points,
    r = e[e.length - 1],
    a = Xe(t.position, r),
    n = Hr + a / 2,
    s =
      f.getState().drawTextValue[t.counter % f.getState().drawTextValue.length],
    i = Vr(s, n);
  if (i && a > i) {
    const d = Math.atan2(r.y - t.position.y, r.x - t.position.x),
      h = new p.fabric.Text(s, {
        fontSize: n,
        top: t.position.y,
        left: t.position.x,
        fontFamily: f.getState().textFontFamily,
        originX: "left",
        originY: "bottom",
        angle: p.fabric.util.radiansToDegrees(d),
        fill: f.getState().drawColors[0],
      });
    return (
      (t.position = {
        x: t.position.x + Math.cos(d) * i,
        y: t.position.y + Math.sin(d) * i,
      }),
      t.counter++,
      t.counter > f.getState().drawTextValue.length - 1 && (t.counter = 0),
      h
    );
  }
}
function Vr(t, e) {
  return new p.fabric.Text(t, {
    fontSize: e,
    fontFamily: f.getState().textFontFamily,
  }).width;
}
class Yr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "points", []);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.MULTI_LINE);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = Date.now();
    if (r - this.lastTime < 30) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    this.points.push(a),
      !(this.points.length < 2) &&
        (this.group.addWithUpdate(zr(this.points)),
        (n = l.canvas) == null || n.renderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function zr(t) {
  var n, s;
  const e = f.getState().drawColors[0],
    r = Math.ceil(
      f.getState().drawWidth /
        3 /
        ((s = (n = l.canvas) == null ? void 0 : n.getZoom()) != null ? s : 1)
    ),
    a = [];
  if (
    (a.push(
      new p.fabric.Line(
        [
          t[t.length - 1].x,
          t[t.length - 1].y,
          t[t.length - 2].x,
          t[t.length - 2].y,
        ],
        { stroke: e, strokeWidth: r }
      )
    ),
    t.length % 5 === 0)
  )
    for (let i = t.length - 5, d = 0; i >= 0 && d < 3; i = i - 5, d++)
      a.push(
        new p.fabric.Line(
          [t[t.length - 1].x, t[t.length - 1].y, t[i].x, t[i].y],
          { stroke: e, strokeWidth: r / 3 }
        )
      );
  return new p.fabric.Group(a);
}
let Te = 0;
class jr {
  constructor() {
    u(this, "points", []);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.RAINBOW);
  }
  addPosition(e) {
    var a;
    if (!e) return;
    const r = new p.fabric.Point(e.x, e.y);
    this.points.push(r),
      !(this.points.length < 2) &&
        (this.group.addWithUpdate(Ur(this.points)),
        (a = l.canvas) == null || a.requestRenderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Ur(t) {
  var d, h;
  const e = Math.ceil(
    f.getState().drawWidth /
      ((h = (d = l.canvas) == null ? void 0 : d.getZoom()) != null ? h : 1)
  );
  Te = Te < 360 ? Te + 1 : 0;
  const r = t[t.length - 1].x,
    a = t[t.length - 1].y,
    n = t[t.length - 2].x,
    s = t[t.length - 2].y;
  return new p.fabric.Line([n, s, r, a], {
    stroke: `hsl(${Te}, 90%, 50%)`,
    strokeWidth: e,
    originX: "center",
    originY: "center",
  });
}
class $r {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "lastPoint", null);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.THORN);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = Date.now();
    if (r - this.lastTime < 30) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    if (!this.lastPoint) {
      this.lastPoint = a;
      return;
    }
    this.group.addWithUpdate(Zr(this, a)),
      (n = l.canvas) == null || n.renderAll();
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Zr(t, e) {
  var d, h;
  const r = t.lastPoint,
    a = Xe(r, e),
    n = p.fabric.util.radiansToDegrees(Math.atan2(e.y - r.y, e.x - r.x)),
    s =
      3 / ((h = (d = l.canvas) == null ? void 0 : d.getZoom()) != null ? h : 1),
    i = new p.fabric.Ellipse({
      left: e.x,
      top: e.y,
      originX: "center",
      originY: "center",
      fill: f.getState().drawColors[0],
      opacity: Math.random(),
      rx: a * 5 + s,
      ry: s,
    });
  return i.rotate(n), (t.lastPoint = e), i;
}
class qr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "lastCoordinates", []);
    u(this, "points", []);
    u(this, "group");
    u(this, "shadow");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e),
      (this.group = e),
      (this.shadow = new p.fabric.Shadow({
        blur: 3,
        offsetX: 0,
        offsetY: 0,
        color: f.getState().drawColors[0],
      })),
      G(e, A.MULTI_POINT);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = Date.now();
    if (r - this.lastTime < 30) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    this.points.push(a),
      !(this.points.length < 2) &&
        (this.group.addWithUpdate(Kr(this)),
        (n = l.canvas) == null || n.renderAll());
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Kr(t) {
  var L, b;
  const { points: e, lastCoordinates: r } = t,
    a = (b = (L = l.canvas) == null ? void 0 : L.getZoom()) != null ? b : 1,
    n = Math.ceil((f.getState().drawWidth * 3) / a),
    s = 6 / a,
    i = 2 / a,
    d = e[e.length - 1].x,
    h = e[e.length - 1].y,
    g = [],
    m = de(d, h, n, f.getState().drawShapeCount),
    C = m.map(
      (y) =>
        new p.fabric.Circle({
          left: y.x,
          top: y.y,
          radius: s,
          fill: f.getState().drawColors[0],
        })
    );
  if ((g.push(...C), r != null && r.length)) {
    const y = r.map(
      (v, x) =>
        new p.fabric.Line([v.x + s, v.y + s, m[x].x + s, m[x].y + s], {
          stroke: f.getState().drawColors[0],
          strokeWidth: i,
        })
    );
    g.push(...y);
  }
  return (t.lastCoordinates = m), new p.fabric.Group(g);
}
class Jr {
  constructor() {
    u(this, "lastTime", 0);
    u(this, "flip", 1);
    u(this, "lastPoint", null);
    u(this, "group");
    var r;
    const e = new p.fabric.Group([], { perPixelTargetFind: !0 });
    (r = l.canvas) == null || r.add(e), (this.group = e), G(e, A.WIGGLE);
  }
  addPosition(e) {
    var n;
    if (!e) return;
    const r = Date.now();
    if (r - this.lastTime < 30) return;
    this.lastTime = r;
    const a = new p.fabric.Point(e.x, e.y);
    if (!this.lastPoint) {
      this.lastPoint = a;
      return;
    }
    this.group.addWithUpdate(Qr(this, a)),
      (n = l.canvas) == null || n.renderAll();
  }
  destroy() {
    var e;
    (e = l.canvas) == null || e.remove(this.group);
  }
}
function Qr(t, e) {
  var m, C;
  const r = t.lastPoint,
    a = Xe(r, e),
    n = (r.x + e.x) / 2,
    s = (r.y + e.y) / 2,
    i = p.fabric.util.radiansToDegrees(Math.atan2(e.y - r.y, e.x - r.x)),
    d = p.fabric.util.radiansToDegrees((t.flip % 2) * Math.PI),
    h =
      3 / ((C = (m = l.canvas) == null ? void 0 : m.getZoom()) != null ? C : 1),
    g = new p.fabric.Circle({
      top: s,
      left: n,
      originX: "center",
      originY: "center",
      radius: a / 2,
      startAngle: i + d,
      endAngle: i + d + p.fabric.util.radiansToDegrees(Math.PI),
      stroke: f.getState().drawColors[0],
      strokeWidth: h,
      fill: "",
      strokeLineJoin: "round",
      strokeLineCap: "round",
    });
  return (t.lastPoint = e), t.flip++, g;
}
const W = Oe()(
    _e(
      (t, e) => ({
        shapeStyle: N.Rect,
        borderType: ae.Solid,
        borderColor: "#000000",
        borderWidth: 3,
        fillColor: "#FFFFFF",
        fillType: ue.Transparent,
        shapeLinePointCount: 3,
        updateShapeStyle(r) {
          e().shapeStyle !== r && t({ shapeStyle: r });
        },
        updateBorderType(r) {
          e().borderType !== r && t({ borderType: r });
        },
        updateBorderColor: (r) => {
          e().borderColor !== r && t({ borderColor: r });
        },
        updateBorderWidth: (r) => {
          e().borderWidth !== r && t({ borderWidth: r });
        },
        updateFillColor: (r) => {
          e().fillColor !== r && t({ fillColor: r });
        },
        updateFillType(r) {
          e().fillType !== r && t({ fillType: r });
        },
        updateShapeLinePointCount(r) {
          const a = e().shapeLinePointCount;
          r !== a && t({ shapeLinePointCount: r });
        },
      }),
      { name: "PAINT-BOARD-SHAPE-STORE" }
    )
  ),
  K = () => W.getState().borderWidth,
  J = (t = 5) => {
    const e = W.getState().borderType,
      r = Math.round(t);
    switch (e) {
      case ae.Dashed:
        return [r * 3, r * 2];
      case ae.Dotted:
        return [r, r * 3];
      default:
        return;
    }
  },
  te = () => {
    const { fillType: t, fillColor: e } = W.getState();
    switch (t) {
      case ue.Transparent:
        return "transparent";
      case ue.Full:
        return e;
      default:
        return;
    }
  };
class ea {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var n;
    if (!e) return;
    const r = K(),
      a = new p.fabric.Rect({
        left: e.x,
        top: e.y,
        width: 0,
        height: 0,
        rx: 3,
        ry: 3,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (n = l.canvas) == null || n.add(a),
      (this.shapeInstance = a),
      (this.startX = e.x),
      (this.startY = e.y),
      G(a, A.SHAPE_RECT);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({ width: n, height: s, left: i, top: d }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ta {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var n;
    if (!e) return;
    const r = K(),
      a = new p.fabric.Circle({
        left: e.x,
        top: e.y,
        radius: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (n = l.canvas) == null || n.add(a),
      (this.shapeInstance = a),
      (this.startX = e.x),
      (this.startY = e.y),
      G(a, A.SHAPE_CIRCLE);
  }
  addPosition(e) {
    var g;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = Math.min(n, s) / 2,
      d = r > this.startX ? this.startX : this.startX - i * 2,
      h = a > this.startY ? this.startY : this.startY - i * 2;
    this.shapeInstance.set({ radius: i, left: d, top: h }),
      this.shapeInstance.setCoords(),
      (g = l.canvas) == null || g.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ct {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    (this.startX = e.x), (this.startY = e.y);
    const r = K(),
      a = [];
    for (let i = 0; i < W.getState().shapeLinePointCount; i++)
      a.push({ x: this.startX, y: this.startY });
    const n = new p.fabric.Polyline(a, {
      stroke: W.getState().borderColor,
      strokeWidth: r,
      originX: "center",
      originY: "center",
      strokeDashArray: J(r + 5),
      strokeLineCap: "round",
      fill: "transparent",
      objectCaching: !1,
      perPixelTargetFind: !0,
    });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      G(n, A.SHAPE_LINE);
  }
  addPosition(e) {
    var i;
    if (!e || !this.shapeInstance) return;
    const r = this.shapeInstance.points,
      a = r.length,
      n = (e.x - this.startX) / (a - 1),
      s = (e.y - this.startY) / (a - 1);
    for (let d = 1; d < a; d++)
      r[d] = {
        x: Math.round(this.startX + n * d),
        y: Math.round(this.startY + s * d),
      };
    this.shapeInstance.set({ points: r }),
      this.shapeInstance.setCoords(),
      (i = l.canvas) == null || i.requestRenderAll();
  }
  mouseUp() {
    if (!this.shapeInstance) return;
    const e = this.shapeInstance.points,
      r = e.length - 1;
    (this.shapeInstance.controls = e.reduce(function (a, n, s) {
      return (
        (a["p" + s] = new p.fabric.Control({
          positionHandler: bt,
          actionHandler: yt(s > 0 ? s - 1 : r, St),
          actionName: "polylineEndPoint",
          pointIndex: s,
        })),
        a
      );
    }, {})),
      this.shapeInstance._setPositionDimensions({}),
      this.shapeInstance.setCoords();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ra {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var n;
    if (!e) return;
    const r = K(),
      a = new p.fabric.Ellipse({
        left: e.x,
        top: e.y,
        rx: 0,
        ry: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (n = l.canvas) == null || n.add(a),
      (this.shapeInstance = a),
      (this.startX = e.x),
      (this.startY = e.y),
      G(a, A.SHAPE_ELLIPSE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX) / 2,
      s = Math.abs(a - this.startY) / 2,
      i = r > this.startX ? this.startX : this.startX - n * 2,
      d = a > this.startY ? this.startY : this.startY - s * 2;
    this.shapeInstance.set({ rx: n, ry: s, left: i, top: d }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class aa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var n;
    if (!e) return;
    const r = K(),
      a = new p.fabric.Triangle({
        left: e.x,
        top: e.y,
        width: 0,
        height: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (n = l.canvas) == null || n.add(a),
      (this.shapeInstance = a),
      (this.startX = e.x),
      (this.startY = e.y),
      G(a, A.SHAPE_TRIANGLE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({ width: n, height: s, left: i, top: d }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class na {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m446.24196,887.47009l-175.7696,0c-27.01653,-0.68266 -50.176,-10.68373 -69.23946,-29.7472c-16.91307,-16.896 -26.88,-36.62506 -29.61067,-58.58986a99.1744,99.1744 0 0 1 -1.00693,-14.06294c0,-4.3008 0.29013,-8.89173 0.85333,-13.80693l0,-395.79307l-154.45333,0a17.1008,17.1008 0 0 1 -12.06614,-29.1328l341.33334,-341.33333a17.0496,17.0496 0 0 1 24.13226,0l340.3264,340.3264a17.06667,17.06667 0 0 1 -9.8816,30.99307l-153.94133,0l0,410.45333c-0.64853,27.46027 -10.5984,51.11467 -29.52533,70.74133c-19.98507,19.3536 -43.63947,29.2864 -70.74134,29.96907l-0.4096,-0.01707z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_ARROW_OUTLINE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 718,
      scaleY: s / 887,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class sa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m853.33333,42.66667a192,192 0 0 1 -192,192l-512,0c-129.6,0 -234.66666,-105.06667 -234.66666,-234.66667c0,-126.03733 99.37066,-228.864 224.02133,-234.432a298.41067,298.41067 0 0 1 245.312,-128.23467c134.10133,0 249.45067,88.96 286.35733,213.54667a192,192 0 0 1 182.976,191.78667z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_CLOUD);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 939,
      scaleY: s / 598,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class oa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m1020.60467,131.15818c0,-72.31603 -58.84215,-131.15818 -131.18785,-131.15818l-758.24124,0c-72.32933,0 -131.17558,58.84215 -131.17558,131.15818l0,493.79948c0,72.31602 58.84625,131.05994 131.17558,131.05994l125.70907,0l0,193.82749c0,20.83861 12.4127,39.45562 31.62528,47.46299c19.29136,8.0043 41.26994,3.59897 56.02703,-11.15915l230.14873,-230.13236l314.72908,0c72.3457,0 131.18786,-58.74391 131.18786,-131.05994l-0.00001,-493.79845l0.00205,0z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_TOOLTIPS);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 1020,
      scaleY: s / 1002,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ia {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m-329.49334,256l271.25334,66.66667a5.33333,5.33333 0 0 1 4,5.97333l-51.04,335.68a5.33333,5.33333 0 0 0 9.22666,4.32l434.77334,-490.34667a5.33333,5.33333 0 0 0 -2.72,-8.69333l-271.25334,-66.66667a5.33333,5.33333 0 0 1 -4,-5.97333l51.04,-335.62667a5.33333,5.33333 0 0 0 -9.22666,-4.37333l-434.77334,490.34667a5.33333,5.33333 0 0 0 2.72,8.69333z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_LIGHTNING);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 674,
      scaleY: s / 915,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ca {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m678.76571,546.23086q0,22.82057 -16.01829,38.83886l-77.67771,77.67771q-16.01829,16.01829 -38.83886,16.01829t-38.83885,-16.01829l-168.00915,-168.00914l-168.00914,168.00914q-16.01829,16.01829 -38.83886,16.01829t-38.83885,-16.01829l-77.67772,-77.67771q-16.01828,-16.01829 -16.01828,-38.83886t16.01828,-38.83886l168.00915,-168.00914l-168.00915,-168.00914q-16.01828,-16.01829 -16.01828,-38.83886t16.01828,-38.83886l77.67772,-77.67771q16.01828,-16.01829 38.83885,-16.01829t38.83886,16.01829l168.00914,168.00914l168.00915,-168.00914q16.01828,-16.01829 38.83885,-16.01829t38.83886,16.01829l77.67771,77.67771q16.01829,16.01829 16.01829,38.83886t-16.01829,38.83886l-168.00914,168.00914l168.00914,168.00914q16.01829,16.01829 16.01829,38.83886z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_CLOSE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 679,
      scaleY: s / 679,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class la {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m855.08247,17.19428c-43.5,-30.3 -104,-19.5 -134.6,24.1l-425.8,606l-127,-135.7c-36.4,-38.9 -98.1,-41.1 -137,-4.8c-39,36.2 -41.1,97.7 -4.7,136.6l206.5,220.7c4.7,5 9.8,9.4 15.1,13.1c0.7,0.5 1.4,1 2.2,1.5c43.5,30.3 104,19.5 134.6,-24.1l494,-703.2c30.7,-43.5 20.1,-103.9 -23.3,-134.2z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_CHECK);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 896,
      scaleY: s / 896,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class da {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m512,1024c282.771,0 512,-229.23 512,-512s-229.23,-512 -512,-512s-512,229.23 -512,512s229.23,512 512,512zm-80,-768c0,-44.183 35.817,-80 80,-80s80,35.817 80,80l0,31.999c0,44.183 -35.817,80 -80,80s-80,-35.817 -80,-80l0,-31.999zm-0.001,256c0,-44.183 35.817,-80 80,-80s80,35.817 80,80l0,256c0,44.183 -35.817,80 -80,80s-80,-35.817 -80,-80l0,-256z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_INFO);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 1024,
      scaleY: s / 1024,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ha {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m714.52777,0a138.66667,138.66667 0 0 1 138.45333,130.816l0.21334,7.85066l0,405.33334a138.66667,138.66667 0 0 1 -130.816,138.45333l-7.85067,0.21333l-362.70933,0a138.66667,138.66667 0 0 1 -88.96,-32.256l-6.61334,-5.93066l-213.16266,-202.66667a138.66667,138.66667 0 0 1 -4.90667,-196.01067l4.90667,-4.94933l213.16266,-202.66667a138.66667,138.66667 0 0 1 86.69867,-37.888l8.87467,-0.29866l362.66666,0l0.04267,0zm0,64l-362.70933,0a74.66667,74.66667 0 0 0 -46.08,15.872l-5.376,4.69333l-213.16267,202.66667l-2.64533,2.64533a74.66667,74.66667 0 0 0 -2.34667,100.352l4.992,5.20533l213.16267,202.66667c12.11733,11.52 27.73333,18.64533 44.288,20.224l7.168,0.34133l362.66666,0a74.66667,74.66667 0 0 0 74.45334,-68.56533l0.256,-6.10133l0,-405.33334a74.66667,74.66667 0 0 0 -68.56534,-74.41066l-6.10133,-0.256zm-311.63733,123.60533l3.584,3.11467l105.38666,105.344l105.38667,-105.38667a32,32 0 0 1 48.34133,41.68533l-3.11466,3.584l-105.38667,105.38667l105.38667,105.38667a32,32 0 0 1 -41.64267,48.34133l-3.584,-3.11467l-105.38667,-105.344l-105.38666,105.38667a32,32 0 0 1 -48.34134,-41.68533l3.072,-3.584l105.42934,-105.38667l-105.38667,-105.38667a32,32 0 0 1 41.68533,-48.34133l-0.04266,0z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_BACKSPACE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 853,
      scaleY: s / 682,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class pa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m426.66667,0c235.648,0 426.66667,191.06134 426.66667,426.66667c0,235.69067 -191.01867,426.66667 -426.66667,426.66667c-235.60533,0 -426.66667,-190.976 -426.66667,-426.66667c0,-235.56267 191.06134,-426.66667 426.66667,-426.66667zm0,64a362.66667,362.66667 0 1 0 0,725.33334a362.66667,362.66667 0 0 0 0,-725.33334zm-181.33333,330.66667l362.66666,0a32,32 0 0 1 4.352,63.70133l-4.352,0.29867l-362.66666,0a32,32 0 0 1 -4.352,-63.70133l4.352,-0.29867l362.66666,0l-362.66666,0z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_BLOCK);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 853,
      scaleY: s / 853,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ua {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m489.01486,786.432c29.14743,0 50.13943,-21.43086 50.13943,-50.13943l0,-683.57486c0,-28.70857 -20.992,-52.71771 -50.99886,-52.71771c-20.992,0 -34.70628,10.29486 -57.856,30.86629l-201.43543,178.70628c-2.56,2.56 -6.41828,3.85829 -10.69714,3.85829l-127.28686,0c-60.87314,0 -90.88,30.42743 -90.88,95.14057l0,170.58743c0,64.73143 30.00686,95.14057 90.88,95.14057l127.26858,0c4.29714,0 8.15542,1.28 10.71542,3.85828l201.45372,180.40686c20.992,18.87086 37.72343,27.86743 58.71543,27.86743l-0.01829,0z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_SPEAKER);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 539,
      scaleY: s / 786,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ga {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m309.28596,0a309.33333,309.33333 0 0 1 240.21333,504.27734l209.06667,209.06666a32,32 0 0 1 -41.64267,48.384l-3.584,-3.11466l-209.10933,-209.06667a309.33333,309.33333 0 1 1 -194.944,-549.54667zm0,64a245.33333,245.33333 0 1 0 0,490.66667a245.33333,245.33333 0 0 0 0,-490.66667z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_SEARCH);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 768,
      scaleY: s / 768,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class ma {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m89.68,0c16.93,12.78 35.09,21 56.38,20.55c2.3,0 4.59,-0.06 6.88,0.07a64.3,64.3 0 0 0 35.55,-7.85c4.37,-2.42 8.6,-2.67 13.2,-1.85a8.08,8.08 0 0 1 5.09,2.86c12,14.42 27.73,20.48 46.19,20.6c8.12,0 16,-0.64 23.46,-4.15a13.82,13.82 0 0 1 5.81,-1c2.25,0 4.13,2.72 3.63,4.92a26.24,26.24 0 0 1 -1.32,3.12c-4.65,12.17 -1.88,23.2 5.92,33c2.17,2.71 6.09,4.07 9.32,5.86c2.49,1.38 5.26,2.26 7.68,3.74a3.54,3.54 0 0 1 0.19,5.87a20.31,20.31 0 0 1 -2.87,1.84c-14.12,7.91 -20.69,21 -23.88,36c-1.13,5.36 0.93,10.75 2.65,15.94a57.2,57.2 0 0 1 2.28,7.35c0.63,3.33 -1.25,5.55 -4.74,5.64a33.64,33.64 0 0 1 -6.76,-0.74c-19,-3.33 -36.39,0.36 -51.73,12.4c-2.24,1.76 -4.26,3.83 -6.44,5.67c-2.93,2.47 -5.43,2.7 -8.59,0.86a15.43,15.43 0 0 1 -2.1,-1.5c-6.69,-5.62 -14.73,-7.23 -23.14,-8c-13.19,-1.23 -25.78,1.36 -37.68,6.62c-6.7,3 -11.49,0.84 -16.33,-3.12c-2.65,-2.18 -5.15,-4.55 -7.64,-6.91a24.73,24.73 0 0 0 -12.93,-6.4c-15.06,-2.69 -30.13,-3.61 -45.11,0.76c-4.93,1.44 -10,2.46 -14.87,4.11s-8.33,-0.65 -11.48,-3.67c-0.87,-0.83 -1,-2.56 -1.19,-3.92c-0.87,-5.65 -1.52,-11.33 -2.46,-17a24.82,24.82 0 0 0 -12.9,-18.3c-4.95,-2.78 -9.12,-7.08 -15.62,-7.77l-4.13,-7.6c3.06,-2.94 5.88,-5.71 8.77,-8.4c10.63,-9.91 14.4,-22.38 13.5,-36.5a10.73,10.73 0 0 0 -2.27,-5.31c-2.75,-3.66 -2.57,-7.3 -0.65,-11.71c6.28,0.84 12.44,1.81 18.63,2.47c10.02,1.06 19.28,-1.55 28.27,-5.63a36.86,36.86 0 0 0 14.36,-11.82c1.8,-2.39 3.17,-5 3.15,-7.8c0,-4.54 2.41,-8.06 4,-11.93c0.24,-0.44 0.94,-0.67 1.92,-1.37z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_INFO_OUTLINE);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 309,
      scaleY: s / 172,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class fa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "m760.384,0.00803c47.808,0 91.968,11.968 132.352,35.84a264.32,264.32 0 0 1 95.872,97.152a263.68,263.68 0 0 1 35.392,133.888c0,34.752 -6.592,68.544 -19.712,101.312a262.4,262.4 0 0 1 -57.536,87.424l-434.752,440.384l-434.752,-440.32a268.8,268.8 0 0 1 -77.248,-188.8c0,-48.384 11.776,-93.056 35.392,-133.952a264.32,264.32 0 0 1 95.808,-97.088a255.296,255.296 0 0 1 132.48,-35.84a260.736,260.736 0 0 1 186.24,78.208l62.08,62.912l62.144,-62.912a258.944,258.944 0 0 1 86.336,-58.24a259.584,259.584 0 0 1 100.032,-19.968l-0.128,0z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_HEART);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 1024,
      scaleY: s / 896,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class wa {
  constructor(e) {
    u(this, "shapeInstance");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    const r = K(),
      a =
        "M 300 0 C 204.92302 0 120 65.17035 120 155 A 40 40 0 0 0 120.72852 160.5332 A 40 40 0 0 0 119.83984 165 C 119.83984 285.43738 70.949871 389.48179 19.386719 420.81836 A 40 40 0 0 0 0.33984375 456.98438 A 40 40 0 0 0 0 460 A 40 40 0 0 0 40 500 L 164.75586 500 C 173.8133 535.3936 198.4031 565.81344 231.86914 583.36328 C 274.50045 605.71947 325.49955 605.71947 368.13086 583.36328 C 401.5969 565.81344 426.1867 535.3936 435.24414 500 L 560 500 A 40 40 0 0 0 600 460 A 40 40 0 0 0 599.49023 453.71094 A 40 40 0 0 0 580.45312 415.81836 C 528.88999 384.48179 480 280.43738 480 160 A 40 40 0 0 0 479.78125 156.66016 A 40 40 0 0 0 480 155 C 480 65.17035 395.07698 0 300 0 z",
      n = new p.fabric.Path(a, {
        left: e.x,
        top: e.y,
        scaleX: 0,
        scaleY: 0,
        stroke: W.getState().borderColor,
        strokeWidth: r,
        fill: te(),
        strokeUniform: !0,
        strokeLineCap: "round",
        strokeDashArray: J(r),
        perPixelTargetFind: !0,
      });
    (s = l.canvas) == null || s.add(n),
      (this.shapeInstance = n),
      (this.startX = e.x),
      (this.startY = e.y),
      G(n, A.SHAPE_ALERT);
  }
  addPosition(e) {
    var h;
    if (!e || !this.shapeInstance) return;
    const { x: r, y: a } = new p.fabric.Point(e.x, e.y),
      n = Math.abs(r - this.startX),
      s = Math.abs(a - this.startY),
      i = r > this.startX ? this.startX : this.startX - n,
      d = a > this.startY ? this.startY : this.startY - s;
    this.shapeInstance.set({
      scaleX: n / 600,
      scaleY: s / 600,
      left: i,
      top: d,
    }),
      this.shapeInstance.setCoords(),
      (h = l.canvas) == null || h.requestRenderAll();
  }
  destroy() {
    var e;
    this.shapeInstance &&
      ((e = l.canvas) == null || e.remove(this.shapeInstance));
  }
}
class lt {
  constructor(e) {
    u(this, "shapeLine");
    u(this, "startX", 0);
    u(this, "startY", 0);
    var s;
    if (!e) return;
    (this.startX = e.x), (this.startY = e.y);
    const r = K();
    let a = `M ${this.startX} ${this.startY}`;
    for (let i = 0; i < W.getState().shapeLinePointCount - 1; i++)
      a += ` L ${this.startX} ${this.startY}`;
    (a += ` M ${this.startX} ${this.startY}`),
      (a += ` L ${this.startX - 5} ${this.startY + 5}`),
      (a += ` M ${this.startX} ${this.startY}`),
      (a += ` L ${this.startX + 5} ${this.startY + 5}`);
    const n = new p.fabric.Path(a, {
      stroke: W.getState().borderColor,
      strokeWidth: r,
      originX: "center",
      originY: "center",
      strokeDashArray: J(r + 5),
      strokeLineCap: "round",
      fill: "transparent",
      objectCaching: !1,
      perPixelTargetFind: !0,
    });
    G(n, A.SHAPE_ARROW_LINE),
      (this.shapeLine = n),
      (s = l.canvas) == null || s.add(this.shapeLine);
  }
  addPosition(e) {
    var i;
    if (!e || !this.shapeLine) return;
    let r = this.shapeLine.path;
    const a = r.length - 4,
      n = (e.x - this.startX) / (a - 1),
      s = (e.y - this.startY) / (a - 1);
    for (let d = 1; d < a; d++)
      (r[d][1] = Math.round(this.startX + n * d)),
        (r[d][2] = Math.round(this.startY + s * d));
    (r = kt(r, this.startX, this.startY, e.x, e.y)),
      this.shapeLine._setPath(r),
      (i = l.canvas) == null || i.requestRenderAll();
  }
  mouseUp() {
    if (!this.shapeLine) return;
    const e = this.shapeLine.path;
    (this.shapeLine.controls = e
      .slice(0, e.length - 4)
      .reduce(function (r, a, n) {
        return (
          (r["p" + n] = new p.fabric.Control({
            positionHandler: Et,
            actionHandler: It(n > 0 ? n - 1 : e.length - 5, Mt),
            actionName: "pathEndPoint",
            pointIndex: n,
          })),
          r
        );
      }, {})),
      this.shapeLine.setCoords();
  }
  destroy() {
    var e;
    this.shapeLine && ((e = l.canvas) == null || e.remove(this.shapeLine));
  }
}
class xa {
  constructor() {
    u(this, "isMouseDown", !1);
    u(this, "isSpaceKeyDown", !1);
    u(this, "startPoint");
    u(this, "currentElement", null);
    this.initClickEvent();
  }
  initClickEvent() {
    const e = l.canvas;
    e == null ||
      e.on("mouse:down", (r) => {
        if (((this.isMouseDown = !0), this.isSpaceKeyDown)) return;
        this.startPoint = r.absolutePointer;
        let a = null;
        if (O.getState().mode === z.DRAW) {
          if (O.getState().drawType === ge.Shape)
            switch (W.getState().shapeStyle) {
              case N.Rect:
                a = new ea(r.absolutePointer);
                break;
              case N.Circle:
                a = new ta(r.absolutePointer);
                break;
              case N.Line:
                a = new ct(r.absolutePointer);
                break;
              case N.Ellipse:
                a = new ra(r.absolutePointer);
                break;
              case N.Triangle:
                a = new aa(r.absolutePointer);
                break;
              case N.ArrowLine:
                a = new lt(r.absolutePointer);
                break;
              case N.ArrowOutline:
                a = new na(r.absolutePointer);
                break;
              case N.Cloud:
                a = new sa(r.absolutePointer);
                break;
              case N.Tooltips:
                a = new oa(r.absolutePointer);
                break;
              case N.Lightning:
                a = new ia(r.absolutePointer);
                break;
              case N.Close:
                a = new ca(r.absolutePointer);
                break;
              case N.Check:
                a = new la(r.absolutePointer);
                break;
              case N.Info:
                a = new da(r.absolutePointer);
                break;
              case N.Backspace:
                a = new ha(r.absolutePointer);
                break;
              case N.Block:
                a = new pa(r.absolutePointer);
                break;
              case N.Speaker:
                a = new ua(r.absolutePointer);
                break;
              case N.Search:
                a = new ga(r.absolutePointer);
                break;
              case N.InfoOutline:
                a = new ma(r.absolutePointer);
                break;
              case N.Heart:
                a = new fa(r.absolutePointer);
                break;
              case N.Alert:
                a = new wa(r.absolutePointer);
                break;
            }
          else if (O.getState().drawType === ge.FreeStyle)
            switch (f.getState().drawStyle) {
              case k.Shape:
                a = new Fr();
                break;
              case k.Pixels:
                a = new Dr();
                break;
              case k.Text:
                a = new Gr();
                break;
              case k.MultiLine:
                a = new Yr();
                break;
              case k.Reticulate:
                a = new Lr();
                break;
              case k.Rainbow:
                a = new jr();
                break;
              case k.Thorn:
                a = new $r();
                break;
              case k.MultiPoint:
                a = new qr();
                break;
              case k.Wiggle:
                a = new Jr();
                break;
            }
        }
        this.currentElement = a;
      }),
      e == null ||
        e.on("mouse:move", (r) => {
          var a;
          if (this.isMouseDown) {
            if (this.isSpaceKeyDown) {
              e.relativePan(new p.fabric.Point(r.e.movementX, r.e.movementY));
              return;
            }
            if ((a = l.evnet) != null && a.touchEvent.isTwoTouch) return;
            O.getState().mode === z.DRAW &&
              this.currentElement &&
              this.currentElement.addPosition(r.absolutePointer);
          }
        }),
      e == null ||
        e.on("mouse:up", (r) => {
          var a, n;
          if (((this.isMouseDown = !1), this.currentElement)) {
            let s = !1;
            if (this.startPoint && r.absolutePointer) {
              const { x: i, y: d } = this.startPoint,
                { x: h, y: g } = r.absolutePointer;
              i === h && d === g && (this.currentElement.destroy(), (s = !0));
            }
            s ||
              ((this.currentElement instanceof ct ||
                this.currentElement instanceof lt) &&
                ((a = this.currentElement) == null || a.mouseUp()),
              (n = l.history) == null || n.saveState()),
              (this.currentElement = null);
          }
        }),
      e == null ||
        e.on("mouse:dblclick", (r) => {
          var a;
          if (r != null && r.absolutePointer) {
            const { x: n, y: s } = r.absolutePointer;
            (a = l.textElement) == null || a.loadText(n, s);
          }
        });
  }
  setSpaceKeyDownState(e) {
    this.isSpaceKeyDown = e;
  }
}
class Ca {
  constructor() {
    this.initObjectEvent(), this.initTextEvent();
  }
  initObjectEvent() {
    const e = l == null ? void 0 : l.canvas;
    e == null ||
      e.on("selection:created", () => {
        l.triggerHook();
      }),
      e == null ||
        e.on("selection:updated", () => {
          l.triggerHook();
        }),
      e == null ||
        e.on("selection:cleared", () => {
          l.triggerHook();
        }),
      e == null ||
        e.on("path:created", (r) => {
          var n;
          const { mode: a } = O.getState();
          if ([z.DRAW, z.ERASE].includes(a)) {
            if (a === z.DRAW) {
              const s = Ce();
              r.path.set({ id: s, perPixelTargetFind: !0 });
            }
            (n = l.history) == null || n.saveState();
          }
        }),
      e == null ||
        e.on("object:modified", (r) => {
          var a, n;
          if (((a = r.target) == null ? void 0 : a.type) === "i-text") {
            const s = r.target;
            if (s._textBeforeEdit === s.text) return;
          }
          r.action && r.target && ((n = l.history) == null || n.saveState());
        });
  }
  initTextEvent() {
    const e = l == null ? void 0 : l.canvas;
    e == null ||
      e.on("text:editing:entered", () => {
        l.textElement.isTextEditing = !0;
      }),
      e == null ||
        e.on("text:editing:exited", (r) => {
          const a = r == null ? void 0 : r.target;
          a &&
            ((l.textElement.isTextEditing = !1),
            (a != null && a._customType) || G(a, A.I_TEXT),
            (a == null ? void 0 : a._textBeforeEdit) !==
              (a == null ? void 0 : a.text) &&
              (e.discardActiveObject(), l.render()));
        });
  }
}
let Se;
const ye = 0.3,
  Pe = 5;
class va {
  constructor() {
    u(
      this,
      "updateZoomPercentage",
      ne.exports.debounce((e = !0, r) => {
        var n;
        const a = this.handleZoomPercentage(e);
        return (
          ie.getState().updateZoom(r),
          O.getState().isObjectCaching ||
            p.fabric.Object.prototype.set({ objectCaching: !1 }),
          (n = l.canvas) == null || n.requestRenderAll(),
          a
        );
      }, 500)
    );
    this.initWheelEvent();
  }
  initWheelEvent() {
    const e = l == null ? void 0 : l.canvas;
    e == null ||
      e.on("mouse:wheel", (r) => {
        var d;
        (d = l.textElement) == null || d.resetText();
        const a = r.e.deltaY;
        let n = e.getZoom();
        if (((n = a > 0 ? n * 1.1 : n / 1.1), n < ye || n > Pe)) return;
        O.getState().isObjectCaching ||
          p.fabric.Object.prototype.set({ objectCaching: !0 });
        const s = ((e == null ? void 0 : e.width) || 1) / 2,
          i = ((e == null ? void 0 : e.height) || 1) / 2;
        (n = Math.max(ye, Math.min(Pe, n))),
          e.zoomToPoint({ x: s, y: i }, n),
          r.e.preventDefault(),
          r.e.stopPropagation(),
          this.updateZoomPercentage(!0, n);
      });
  }
  initZoom() {
    const e = l.canvas;
    if (e) {
      const r = ((e == null ? void 0 : e.width) || 1) / 2,
        a = ((e == null ? void 0 : e.height) || 1) / 2;
      e.zoomToPoint(new p.fabric.Point(r, a), 1),
        this.updateZoomPercentage(!0, 1);
    }
  }
  handleZoomPercentage(e = !0) {
    const r = l.canvas;
    let a = 1;
    if (r) {
      const n = r.getZoom();
      (a = Math.round(((n - ye) / (Pe - ye)) * 100)), ba();
    }
    return e && Se && (Se == null || Se(a)), a;
  }
  setZoomHook(e) {
    Se = e;
  }
}
const ba = () => {
  var e;
  const t = (e = l.canvas) == null ? void 0 : e.freeDrawingBrush;
  if (!!t)
    switch (O.getState().mode) {
      case z.ERASE:
        t.width = ze();
        break;
      case z.DRAW:
        [k.Basic, k.Material, k.MultiColor].includes(f.getState().drawStyle) &&
          ((t.width = ke()),
          f.getState().drawStyle === k.Basic &&
            t.shadow &&
            (t.shadow.blur = Le()),
          (t.strokeDashArray = be()));
        break;
    }
};
class Sa {
  constructor() {
    u(this, "isTwoTouch", !1);
    u(this, "isDragging", !1);
    u(this, "startDistance", 1);
    u(this, "startX", 0);
    u(this, "startY", 0);
    u(this, "startScale", 1);
    u(this, "lastPan");
    u(this, "touchStartFn", (e) => {
      e.preventDefault();
      const r = l.canvas;
      if (!r) return;
      const a = e.touches;
      if ((wt.updateIsDisableDraw(a.length >= 2), a.length === 2)) {
        this.isTwoTouch = !0;
        const n = a[0],
          s = a[1];
        (this.startDistance = Math.hypot(s.pageX - n.pageX, s.pageY - n.pageY)),
          (this.startX = (n.pageX + s.pageX) / 2),
          (this.startY = (n.pageY + s.pageY) / 2),
          (this.startScale = r.getZoom());
      }
    });
    u(this, "touchMoveFn", (e) => {
      var n;
      e.preventDefault();
      const r = l.canvas;
      if (!r) return;
      const a = e.touches;
      if (a.length === 2) {
        const s = a[0],
          i = a[1],
          d = Math.hypot(i.pageX - s.pageX, i.pageY - s.pageY),
          h = (s.pageX + i.pageX) / 2,
          g = (s.pageY + i.pageY) / 2;
        let m = this.startScale * (d / this.startDistance);
        (m = Math.max(ye, Math.min(Pe, m))),
          O.getState().isObjectCaching ||
            p.fabric.Object.prototype.set({ objectCaching: !0 }),
          r.zoomToPoint(new p.fabric.Point(this.startX, this.startY), m),
          (n = l.evnet) == null || n.zoomEvent.updateZoomPercentage(!0, m);
        const C = new p.fabric.Point(h - this.startX, g - this.startY);
        this.isDragging
          ? this.lastPan &&
            (O.getState().isObjectCaching ||
              p.fabric.Object.prototype.set({ objectCaching: !0 }),
            r.relativePan(
              new p.fabric.Point(C.x - this.lastPan.x, C.y - this.lastPan.y)
            ),
            (this.lastPan = C),
            this.saveTransform())
          : ((this.isDragging = !0), (this.lastPan = C));
      }
    });
    u(this, "touchEndFn", (e) => {
      (this.isDragging = !1),
        this.isTwoTouch && e.touches.length === 0 && (this.isTwoTouch = !1);
    });
    u(
      this,
      "saveTransform",
      ne.exports.debounce(() => {
        var r, a;
        const e = (r = l.canvas) == null ? void 0 : r.viewportTransform;
        e &&
          (ie.getState().updateTransform(e),
          O.getState().isObjectCaching ||
            p.fabric.Object.prototype.set({ objectCaching: !1 }),
          (a = l.canvas) == null || a.requestRenderAll());
      }, 500)
    );
    this.initTouchEvent();
  }
  initTouchEvent() {
    var r;
    const e =
      (r = l == null ? void 0 : l.canvas) == null ? void 0 : r.upperCanvasEl;
    e &&
      (e.addEventListener("touchstart", this.touchStartFn, { passive: !1 }),
      e.addEventListener("touchmove", this.touchMoveFn, { passive: !1 }),
      e.addEventListener("touchend", this.touchEndFn, { passive: !1 }));
  }
  removeTouchEvent() {
    var r;
    const e =
      (r = l == null ? void 0 : l.canvas) == null ? void 0 : r.upperCanvasEl;
    e &&
      (e.removeEventListener("touchstart", this.touchStartFn),
      e.removeEventListener("touchmove", this.touchMoveFn),
      e.removeEventListener("touchend", this.touchEndFn));
  }
}
var Re = ((t) => ((t.SPACE = "Space"), (t.BACKSPACE = "Backspace"), t))(
  Re || {}
);
class je {
  constructor() {
    u(this, "image", null);
  }
  addImage(e) {
    const r = l.canvas;
    !r ||
      p.fabric.Image.fromURL(
        e,
        (a) => {
          const n = r.getVpCenter(),
            s = r.getWidth() / 2 / ((a == null ? void 0 : a.width) || 1),
            i = r.getHeight() / 2 / ((a == null ? void 0 : a.height) || 1),
            d = Math.min(s, i, 1);
          a.scale(d),
            a.set({
              left: n.x - a.getScaledWidth() / 2,
              top: n.y - a.getScaledHeight() / 2,
            }),
            G(a, A.IMAGE),
            r.add(a),
            l.render();
        },
        { crossOrigin: "anonymous" }
      );
  }
}
function ya(t, e) {
  var a, n, s, i, d, h, g, m, C, L, b, y, v, x, S, I, T, E;
  const r =
    (n =
      (a = t.filters) == null
        ? void 0
        : a.findIndex((M) => (M == null ? void 0 : M.type) === e)) != null
      ? n
      : -1;
  if (r > -1) (s = t.filters) == null || s.splice(r, 1);
  else
    switch (e) {
      case "Grayscale":
        (i = t.filters) == null ||
          i.push(new p.fabric.Image.filters.Grayscale());
        break;
      case "Invert":
        (d = t.filters) == null || d.push(new p.fabric.Image.filters.Invert());
        break;
      case "BlackWhite":
        (h = t.filters) == null ||
          h.push(new p.fabric.Image.filters.BlackWhite());
        break;
      case "Sepia":
        (g = t.filters) == null || g.push(new p.fabric.Image.filters.Sepia());
        break;
      case "Blur":
        (m = t.filters) == null ||
          m.push(new p.fabric.Image.filters.Blur({ blur: 0.5 }));
        break;
      case "Vintage":
        (C = t.filters) == null || C.push(new p.fabric.Image.filters.Vintage());
        break;
      case "BlendColor":
        (L = t.filters) == null ||
          L.push(
            new p.fabric.Image.filters.BlendColor({
              color: "#66CC89",
              mode: "diff",
            })
          );
        break;
      case "Brownie":
        (b = t.filters) == null || b.push(new p.fabric.Image.filters.Brownie());
        break;
      case "Kodachrome":
        (y = t.filters) == null ||
          y.push(new p.fabric.Image.filters.Kodachrome());
        break;
      case "Pixelate":
        (v = t.filters) == null ||
          v.push(new p.fabric.Image.filters.Pixelate());
        break;
      case "Polaroid":
        (x = t.filters) == null ||
          x.push(new p.fabric.Image.filters.Polaroid());
        break;
      case "Technicolor":
        (S = t.filters) == null ||
          S.push(new p.fabric.Image.filters.Technicolor());
        break;
      case "Brightness":
        (I = t.filters) == null ||
          I.push(new p.fabric.Image.filters.Brightness({ brightness: 0.6 }));
        break;
      case "Noise":
        (T = t.filters) == null ||
          T.push(new p.fabric.Image.filters.Noise({ noise: 100 }));
        break;
      case "Convolute":
        (E = t.filters) == null ||
          E.push(
            new p.fabric.Image.filters.Convolute({
              matrix: [1, 1, 1, 1, 0.7, -1, -1, -1, -1],
            })
          );
        break;
    }
  t.applyFilters();
}
class ka {
  constructor() {
    this.initWindowEvent();
  }
  initWindowEvent() {
    window.addEventListener("keydown", this.keydownFn),
      window.addEventListener("keyup", this.keyupFn),
      window.addEventListener("paste", this.pasteFn),
      window.addEventListener("resize", this.resizeFn),
      window.addEventListener("orientationchange", this.resizeFn);
  }
  removeWindowEvent() {
    window.removeEventListener("keydown", this.keydownFn),
      window.removeEventListener("keyup", this.keyupFn),
      window.removeEventListener("paste", this.pasteFn),
      window.removeEventListener("resize", this.resizeFn),
      window.removeEventListener("orientationchange", this.resizeFn);
  }
  keydownFn(e) {
    var a;
    const r = l == null ? void 0 : l.canvas;
    switch (e.code) {
      case Re.SPACE:
        (a = l == null ? void 0 : l.evnet) == null ||
          a.clickEvent.setSpaceKeyDownState(!0),
          r &&
            (O.getState().isObjectCaching ||
              p.fabric.Object.prototype.set({ objectCaching: !0 }),
            (r.defaultCursor = "pointer"),
            (r.isDrawingMode = !1),
            (r.selection = !1),
            p.fabric.Object.prototype.set({
              selectable: !1,
              hoverCursor: "pointer",
            }));
        break;
      case Re.BACKSPACE:
        l.deleteObject();
        break;
    }
  }
  keyupFn(e) {
    var r, a;
    if (e.code === Re.SPACE) {
      (r = l.evnet) == null || r.clickEvent.setSpaceKeyDownState(!1),
        l.canvas && (l.canvas.defaultCursor = "default");
      const n = (a = l.canvas) == null ? void 0 : a.viewportTransform;
      n &&
        (ie.getState().updateTransform(n),
        O.getState().isObjectCaching ||
          p.fabric.Object.prototype.set({ objectCaching: !1 }),
        l.handleMode());
    }
  }
  pasteFn(e) {
    if (e.clipboardData && e.clipboardData.items) {
      const r = e.clipboardData.items,
        a = Array.from(r).find(
          (n) => n.kind === "file" && n.type.indexOf("image") !== -1
        );
      if (a) {
        const n = a.getAsFile();
        if (n) {
          const s = new FileReader();
          (s.onload = (i) => {
            var h;
            const d = (h = i.target) == null ? void 0 : h.result;
            d && typeof d == "string" && new je().addImage(d);
          }),
            s.readAsDataURL(n);
        }
      }
    }
  }
  resizeFn() {
    const e = l.canvas;
    e &&
      (e.setWidth(window.innerWidth * O.getState().canvasWidth),
      e.setHeight(window.innerHeight * O.getState().canvasHeight),
      ve());
  }
}
class La {
  constructor() {
    u(this, "clickEvent");
    u(this, "zoomEvent");
    u(this, "objectEvent");
    u(this, "windowEvent");
    u(this, "touchEvent");
    const e = new xa();
    this.clickEvent = e;
    const r = new va();
    this.zoomEvent = r;
    const a = new Ca();
    this.objectEvent = a;
    const n = new ka();
    this.windowEvent = n;
    const s = new Sa();
    this.touchEvent = s;
  }
  removeEvent() {
    this.windowEvent.removeWindowEvent(), this.touchEvent.removeTouchEvent();
  }
}
const re = {
  BOLD: "bold",
  ITALIC: "italic",
  UNDER_LINE: "underline",
  LINE_THROUGH: "linethrough",
};
class Ea {
  constructor() {
    u(this, "text", null);
    u(this, "isTextEditing", !1);
  }
  loadText(e, r) {
    var n;
    const a = l == null ? void 0 : l.canvas;
    if (a) {
      const s = a.getVpCenter(),
        { fontStyles: i, drawColors: d, textFontFamily: h } = f.getState(),
        g = ne.exports.isUndefined(e) && ne.exports.isUndefined(r),
        m = new p.fabric.IText("Type here...", {
          originX: g ? "center" : "left",
          originY: g ? "center" : "top",
          left: g ? s.x : e,
          top: g ? s.y : r,
          fill: d[0],
          fontSize:
            25 / ((n = a == null ? void 0 : a.getZoom()) != null ? n : 1),
          fontFamily: h,
          fontWeight: i.includes(re.BOLD) ? "bold" : "normal",
          fontStyle: i.includes(re.ITALIC) ? "italic" : "normal",
          underline: i.includes(re.UNDER_LINE),
          linethrough: i.includes(re.LINE_THROUGH),
        });
      (this.text = m),
        a.add(m),
        a.setActiveObject(m),
        m.enterEditing(),
        m.selectAll();
    }
  }
  resetText() {
    this != null && this.text && (this.text.exitEditing(), (this.text = null));
  }
}
const Ma = () => {
  const t = l.canvas;
  if (!t) return;
  const e = new p.fabric.PencilBrush(t);
  (t.isDrawingMode = !0),
    (t.freeDrawingBrush = e),
    (t.freeDrawingBrush.width = ke()),
    (t.freeDrawingBrush.color = f.getState().drawColors[0]);
  const r = be();
  (t.freeDrawingBrush.strokeDashArray = r),
    (t.freeDrawingBrush.shadow = new p.fabric.Shadow({
      blur: Le(),
      offsetX: 0,
      offsetY: 0,
      color: f.getState().shadowColor,
    }));
};
class Ia {
  constructor() {
    u(this, "canvas", null);
    u(this, "evnet", null);
    u(this, "history", null);
    u(this, "textElement");
    u(this, "hookFn", []);
    u(
      this,
      "updateCanvasWidth",
      ne.exports.debounce((e) => {
        this.canvas &&
          (this.canvas.setWidth(window.innerWidth * e),
          ve(),
          ie.getState().updateCanvasWidth(e));
      }, 500)
    );
    u(
      this,
      "updateCanvasHeight",
      ne.exports.debounce((e) => {
        this.canvas &&
          (this.canvas.setHeight(window.innerHeight * e),
          ve(),
          ie.getState().updateCanvasHeight(e));
      }, 500)
    );
    this.textElement = new Ea();
  }
  initCanvas(e) {
    return new Promise(async (r) => {
      (this.canvas = new p.fabric.Canvas(e, {
        selectionColor: "rgba(101, 204, 138, 0.3)",
        preserveObjectStacking: !0,
        enableRetinaScaling: !0,
        backgroundVpt: !1,
      })),
        p.fabric.Object.prototype.set({
          borderColor: "#65CC8A",
          cornerColor: "#65CC8A",
          cornerStyle: "circle",
          borderDashArray: [3, 3],
          transparentCorners: !1,
        }),
        (p.fabric.Line.prototype.strokeLineJoin = "round"),
        (p.fabric.Line.prototype.strokeLineCap = "round"),
        Ve() && wt.initCanvas(this.canvas),
        xt.init(this.canvas, O.getState().openGuideLine),
        (this.evnet = new La()),
        this.handleMode(),
        await this.initCanvasStorage(),
        r(!0);
    });
  }
  removeCanvas() {
    var e, r;
    this.canvas &&
      ((e = this == null ? void 0 : this.canvas) == null || e.dispose(),
      (r = this.evnet) == null || r.removeEvent(),
      (this.canvas = null));
  }
  initCanvasStorage() {
    return new Promise((e) => {
      setTimeout(() => {
        const { files: r, currentId: a } = ie.getState(),
          n =
            r == null
              ? void 0
              : r.find((s) => (s == null ? void 0 : s.id) === a);
        n && this.canvas
          ? (this.canvas.clear(),
            this.canvas.loadFromJSON(n.boardData, () => {
              this.canvas &&
                (n.viewportTransform &&
                  this.canvas.setViewportTransform(n.viewportTransform),
                (n == null ? void 0 : n.zoom) &&
                  this.canvas.width &&
                  this.canvas.height &&
                  this.canvas.zoomToPoint(
                    new p.fabric.Point(
                      this.canvas.width / 2,
                      this.canvas.height / 2
                    ),
                    n.zoom
                  ),
                this.canvas.setWidth(
                  window.innerWidth *
                    ((n == null ? void 0 : n.canvasWidth) || 1)
                ),
                O.getState().updateCanvasWidth(
                  (n == null ? void 0 : n.canvasWidth) || 1
                ),
                this.canvas.setHeight(
                  window.innerHeight *
                    ((n == null ? void 0 : n.canvasHeight) || 1)
                ),
                O.getState().initBackground(),
                O.getState().updateCanvasHeight(
                  (n == null ? void 0 : n.canvasHeight) || 1
                ),
                We(this.canvas),
                p.fabric.Object.prototype.set({
                  objectCaching: O.getState().isObjectCaching,
                }),
                this.canvas.renderAll(),
                this.triggerHook(),
                (this.history = new wr())),
                e(!0);
            }))
          : e(!0);
      }, 300);
    });
  }
  handleMode(e = O.getState().mode) {
    if (!this.canvas) return;
    let r = !1,
      a = !1;
    const n = { selectable: !1, hoverCursor: "default" };
    switch (e) {
      case z.DRAW:
        O.getState().drawType === ge.FreeStyle &&
          [k.Basic, k.Material, k.MultiColor].includes(
            f.getState().drawStyle
          ) &&
          ((r = !0), this.handleDrawStyle()),
          this.canvas.discardActiveObject();
        break;
      case z.ERASE:
        (r = !0),
          (this.canvas.freeDrawingBrush = new p.fabric.EraserBrush(
            this.canvas
          )),
          (this.canvas.freeDrawingBrush.width = ze()),
          (this.canvas.freeDrawingBrush.color = "#FFF"),
          this.canvas.discardActiveObject();
        break;
      case z.Board:
      case z.SELECT:
        (n.selectable = !0), (n.hoverCursor = void 0), (a = !0);
        break;
    }
    (this.canvas.isDrawingMode = r),
      (this.canvas.selection = a),
      p.fabric.Object.prototype.set(n),
      this.canvas.forEachObject((s) => {
        s._customType === A.I_TEXT &&
          ((s.selectable = n.selectable), (s.hoverCursor = n.hoverCursor));
      }),
      this.canvas.requestRenderAll();
  }
  handleDrawStyle() {
    if (!this.canvas) return;
    switch (f.getState().drawStyle) {
      case k.Basic:
        Ma();
        break;
      case k.Material:
        (this.canvas.isDrawingMode = !0), He.render({});
        break;
      case k.MultiColor:
        Ge({});
        break;
      default:
        this.canvas.isDrawingMode = !1;
        break;
    }
  }
  deleteObject() {
    if (!this.textElement.isTextEditing && this.canvas) {
      const e = this.canvas.getActiveObjects();
      e != null &&
        e.length &&
        (this.canvas.discardActiveObject(),
        e == null ||
          e.forEach((r) => {
            var a;
            (a = this.canvas) == null || a.remove(r);
          }),
        this.render());
    }
  }
  render() {
    var e, r;
    this.canvas &&
      ((e = this.canvas) == null || e.requestRenderAll(),
      (r = this.history) == null || r.saveState());
  }
  copyObject() {
    const e = this.canvas;
    if (!e) return;
    const r = e.getActiveObjects();
    if (r.length <= 0) return;
    e.discardActiveObject();
    const a = r.map(
      (n) =>
        new Promise((s) => {
          n == null ||
            n.clone((i) => {
              const d = Ce();
              i.set({
                left: ((i == null ? void 0 : i.left) || 0) + 10,
                top: ((i == null ? void 0 : i.top) || 0) + 10,
                evented: !0,
                id: d,
                perPixelTargetFind: !0,
              }),
                s(i),
                e.add(i);
            });
        })
    );
    Promise.all(a).then((n) => {
      const s = new p.fabric.ActiveSelection(n, { canvas: e });
      e.setActiveObject(s), this.render();
    });
  }
  bringForWard() {
    const e = this.canvas;
    if (e) {
      const r = e.getActiveObject();
      r && (e.bringForward(r, !0), this.render());
    }
  }
  seendBackWard() {
    const e = this.canvas;
    if (e) {
      const r = e.getActiveObject();
      r && (e.sendBackwards(r, !0), this.render());
    }
  }
  bringToFront() {
    const e = this.canvas;
    if (e) {
      const r = e.getActiveObject();
      r && (e.bringToFront(r), this.render());
    }
  }
  sendToBack() {
    const e = this.canvas;
    if (e) {
      const r = e.getActiveObject();
      r && (e.sendToBack(r), this.render());
    }
  }
  addHookFn(e) {
    this.hookFn.push(e);
  }
  removeHookFn(e) {
    const r = this.hookFn.findIndex((a) => a === e);
    r > -1 && this.hookFn.splice(r, 1);
  }
  triggerHook() {
    this.hookFn.map((e) => {
      e == null || e();
    });
  }
}
const l = new Ia(),
  Ta = [
    { type: z.DRAW, text: "tool.draw" },
    { type: z.ERASE, text: "tool.eraser" },
    { type: z.SELECT, text: "tool.select" },
    { type: z.Board, text: "tool.board" },
  ],
  Pa = [
    { type: ge.FreeStyle, text: "drawType.freeStyle" },
    { type: ge.Shape, text: "drawType.shape" },
  ],
  Ra = () => {
    const { drawShapeCount: t, updateDrawShapeCount: e } = f(),
      { t: r } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.shapeCount"),
        }),
        c("input", {
          type: "range",
          min: "1",
          max: "5",
          value: t,
          className: "range range-primary range-xs",
          step: "1",
          onChange: (a) => e(Number(a.target.value)),
        }),
        w("div", {
          className: "w-full flex justify-between text-xs px-2 font-fredokaOne",
          children: [
            c("span", { children: "1" }),
            c("span", { children: "2" }),
            c("span", { children: "3" }),
            c("span", { children: "4" }),
            c("span", { children: "5" }),
          ],
        }),
      ],
    });
  },
  Na = (t) =>
    o.exports.createElement(
      "svg",
      {
        height: "18px",
        width: "18px",
        id: "_x32_",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        viewBox: "0 0 512 512",
        xmlSpace: "preserve",
        fill: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          null,
          o.exports.createElement("path", {
            fill: "currentColor",
            d: "M133.048,121.218c-1.663,0-3.296,0.337-4.841,0.996c-20.036,8.606-36.119,24.218-45.306,43.973 c-1.381,2.966-1.522,6.3-0.4,9.375c1.122,3.083,3.382,5.546,6.371,6.936c1.64,0.761,3.373,1.146,5.17,1.146 c4.762,0,9.14-2.794,11.14-7.116c6.646-14.27,18.256-25.544,32.715-31.726c3.013-1.294,5.342-3.68,6.567-6.732 c1.216-3.044,1.177-6.386-0.118-9.398C142.408,124.144,137.967,121.218,133.048,121.218z",
          }),
          o.exports.createElement("path", {
            fill: "currentColor",
            d: "M325.854,203.342c-0.016-89.821-73.11-162.915-162.932-162.931C73.102,40.427,0.015,113.521,0,203.342 c0.015,89.821,73.102,162.908,162.923,162.924C252.744,366.25,325.838,293.163,325.854,203.342z M162.923,334.344 c-34.974-0.008-67.869-13.636-92.629-38.372c-24.736-24.768-38.364-57.664-38.372-92.63c0.008-34.982,13.635-67.877,38.372-92.63 c24.775-24.743,57.671-38.371,92.629-38.379c34.967,0.008,67.862,13.636,92.63,38.379c24.744,24.768,38.372,57.664,38.38,92.63 c-0.008,34.959-13.635,67.854-38.38,92.63C230.793,320.708,197.898,334.336,162.923,334.344z",
          }),
          o.exports.createElement("path", {
            fill: "currentColor",
            d: "M427.458,69.815c-46.6,0.008-84.532,37.932-84.549,84.541c0.016,46.601,37.948,84.525,84.549,84.541 c46.601-0.016,84.526-37.94,84.542-84.541C511.984,107.747,474.06,69.823,427.458,69.815z M464.661,191.575 c-9.963,9.924-23.175,15.392-37.203,15.4c-14.035-0.008-27.247-5.476-37.218-15.408c-9.924-9.963-15.392-23.175-15.4-37.21 c0.008-14.035,5.476-27.246,15.408-37.219c9.963-9.924,23.175-15.392,37.21-15.4c14.028,0.008,27.24,5.477,37.211,15.408 c9.924,9.964,15.4,23.184,15.408,37.211C480.07,168.383,474.593,181.603,464.661,191.575z",
          }),
          o.exports.createElement("path", {
            fill: "currentColor",
            d: "M349.076,251.325c-2.683,10.434-6.261,20.664-10.654,30.487c16.146,2.808,30.761,10.379,42.428,22.03 c15.024,15.047,23.292,35.029,23.301,56.258c-0.008,21.23-8.277,41.212-23.301,56.258c-15.048,15.024-35.03,23.301-56.258,23.309 c-21.23-0.008-41.212-8.284-56.266-23.309c-11.015-11.03-18.421-24.822-21.559-40.042c-9.666,4.691-19.746,8.574-30.056,11.572 c12.655,49.386,56.699,83.686,107.882,83.701c61.46-0.015,111.473-50.029,111.489-111.489 C436.065,308.038,399.608,262.661,349.076,251.325z",
          })
        )
      )
    ),
  Aa = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "#ffffff",
        id: "Capa_1",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: "16px",
        height: "16px",
        viewBox: "0 0 940.688 940.688",
        xmlSpace: "preserve",
        stroke: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          null,
          o.exports.createElement("path", {
            fill: "currentColor",
            d: "M885.344,319.071l-258-3.8l-102.7-264.399c-19.8-48.801-88.899-48.801-108.6,0l-102.7,264.399l-258,3.8 c-53.4,3.101-75.1,70.2-33.7,103.9l209.2,181.4l-71.3,247.7c-14,50.899,41.1,92.899,86.5,65.899l224.3-122.7l224.3,122.601 c45.4,27,100.5-15,86.5-65.9l-71.3-247.7l209.2-181.399C960.443,389.172,938.744,322.071,885.344,319.071z",
          })
        )
      )
    ),
  Oa = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "currentColor",
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M20.808,11.079C19.829,16.132,12,20.5,12,20.5s-7.829-4.368-8.808-9.421C2.227,6.1,5.066,3.5,8,3.5a4.444,4.444,0,0,1,4,2,4.444,4.444,0,0,1,4-2C18.934,3.5,21.773,6.1,20.808,11.079Z",
        })
      )
    ),
  _a = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "currentColor",
        width: "16px",
        height: "16px",
        viewBox: "0 0 512 512",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M214.37 208H70.57c-31 0-57.37 14.9-67.26 45.33C1.57 258.71 0 265.54 0 272c0 48 96 128 144 128 28.95 0 53.24-10.67 75.72-33.14-8.58 11.05-13.81 23.47-15.72 37.28-6.98 49.25 1.73 83.2 27.23 91.48C255.99 503.66 288 512 304 512c48 0 53.35-109.18 26.33-144.39L214.37 208zm29.29-21.28L288.1 49.96C297.68 20.47 320 0 352 0c5.66 0 12.64.62 18.78 2.61 45.65 14.84 92.07 130.86 77.23 176.51-8.94 27.54-26.59 47.34-54.91 61.77 13.15-4.74 26.59-5.88 40.31-3.42 49 8.58 78.59 27.35 78.59 54.16 0 26.04-1.96 59.05-6.91 74.27-14.83 45.65-120.32 17.01-145.46-19.58l-115.97-159.6z",
        })
      )
    ),
  Ba = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "18px",
        height: "18px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        stroke: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M11.9994 3V7M11.9994 7V17M11.9994 7L8.99943 4M11.9994 7L14.9994 4M11.9994 17V21M11.9994 17L8.99943 20M11.9994 17L14.9994 20M4.20624 7.49999L7.67034 9.49999M7.67034 9.49999L16.3306 14.5M7.67034 9.49999L3.57227 10.5981M7.67034 9.49999L6.57227 5.40191M16.3306 14.5L19.7947 16.5M16.3306 14.5L17.4287 18.5981M16.3306 14.5L20.4287 13.4019M4.2067 16.5L7.6708 14.5M7.6708 14.5L16.3311 9.49999M7.6708 14.5L3.57273 13.4019M7.6708 14.5L6.57273 18.5981M16.3311 9.49999L19.7952 7.49999M16.3311 9.49999L17.4291 5.40192M16.3311 9.49999L20.4291 10.5981",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  Fa = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "18px",
        height: "18px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M10.0909 11.9629L19.3636 8.63087V14.1707C18.8126 13.8538 18.1574 13.67 17.4545 13.67C15.4964 13.67 13.9091 15.096 13.9091 16.855C13.9091 18.614 15.4964 20.04 17.4545 20.04C19.4126 20.04 21 18.614 21 16.855C21 16.855 21 16.8551 21 16.855L21 7.49236C21 6.37238 21 5.4331 20.9123 4.68472C20.8999 4.57895 20.8852 4.4738 20.869 4.37569C20.7845 3.86441 20.6352 3.38745 20.347 2.98917C20.2028 2.79002 20.024 2.61055 19.8012 2.45628C19.7594 2.42736 19.716 2.39932 19.6711 2.3722L19.6621 2.36679C18.8906 1.90553 18.0233 1.93852 17.1298 2.14305C16.2657 2.34086 15.1944 2.74368 13.8808 3.23763L11.5963 4.09656C10.9806 4.32806 10.4589 4.52419 10.0494 4.72734C9.61376 4.94348 9.23849 5.1984 8.95707 5.57828C8.67564 5.95817 8.55876 6.36756 8.50501 6.81203C8.4545 7.22978 8.45452 7.7378 8.45455 8.33743V16.1307C7.90347 15.8138 7.24835 15.63 6.54545 15.63C4.58735 15.63 3 17.056 3 18.815C3 20.574 4.58735 22 6.54545 22C8.50355 22 10.0909 20.574 10.0909 18.815C10.0909 18.815 10.0909 18.8151 10.0909 18.815L10.0909 11.9629Z",
          fill: "currentColor",
        })
      )
    ),
  Da = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "currentColor",
        width: "20px",
        height: "20px",
        viewBox: "0 0 32 32",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("title", null, "sun"),
        o.exports.createElement("path", {
          d: "M23.395 14.106c2.958-1.383 2.828-6.068 5.758-5.884-4.125-2.74-4.019 3.106-9.089 1.235 1.107-3.068-2.292-6.286-0.091-8.227-4.855 0.979-0.645 5.039-5.555 7.301-1.384-2.958-6.068-2.828-5.884-5.758-2.74 4.125 3.106 4.019 1.235 9.089-3.068-1.107-6.286 2.292-8.227 0.091 0.979 4.855 5.039 0.645 7.301 5.555-2.958 1.384-2.828 6.068-5.758 5.884 4.125 2.74 4.019-3.106 9.089-1.235-1.107 3.068 2.292 6.286 0.091 8.227 4.855-0.979 0.645-5.039 5.555-7.301 1.384 2.958 6.068 2.828 5.884 5.758 2.74-4.125-3.106-4.019-1.235-9.089 3.068 1.107 6.286-2.292 8.226-0.091-0.979-4.855-5.039-0.645-7.301-5.555z",
        })
      )
    ),
  Wa = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "18px",
        height: "18px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        stroke: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M12 22C17.5228 22 22 17.5228 22 12C22 11.5373 21.3065 11.4608 21.0672 11.8568C19.9289 13.7406 17.8615 15 15.5 15C11.9101 15 9 12.0899 9 8.5C9 6.13845 10.2594 4.07105 12.1432 2.93276C12.5392 2.69347 12.4627 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z",
          fill: "currentColor",
        })
      )
    ),
  Ha = (t) =>
    o.exports.createElement(
      "svg",
      {
        height: "16px",
        width: "16px",
        id: "Capa_1",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        viewBox: "0 0 25.263 25.263",
        xmlSpace: "preserve",
        fill: "currentColor",
        stroke: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          null,
          o.exports.createElement("path", {
            d: "M15.362,9.69c0,0-0.75,1.108-1.068,0c-0.318-1.109-1.346-4.949-1.762-5.226 c-0.417-0.278-0.417-0.278-0.417-0.278s-0.078,1.506-0.594,1.307c-0.515-0.198-4.313-2.217-4.63-2.652L6.574,2.444 c0,0,0.355,3.328-0.515,2.615c0,0,1.113,2.771-2.573,3.048c0,0,1.186,3.087,4.552,4.75c0,0,1.148,1.783-0.949,1.503 c0,0-2.932-0.395-3.325-0.752c0,0-1.548,3.01-3.764,3.128c0,0,2.656,1.504,2.337,4.156c0,0,5.107,0.041,4.911,0.832 c-0.2,0.795-0.555,1.601-0.555,1.601s4.71-0.929,5.422-2.194c0,0,0.989,0.99,1.071,1.939c0,0,2.693-0.594,2.452-2.296 c0,0,1.269,0.948,1.427,2.551l0.554-0.375c0,0-0.319-1.661-1.464-2.967c0,0-0.517-1.308,0.789-0.633c0,0,3.085,1.029,5.7-0.833 c0,0-2.888-0.948-3.006-1.978c0,0,5.394-3.326,5.625-5.542c0,0-1.944,0.198-2.972-0.633c0,0-1.309-0.396,0.394-4.791 c0,0-1.227,0.724-1.62-3.636c0,0-3.051,4.665-4.518,3.082C16.548,5.018,15.165,8.066,15.362,9.69z",
          })
        )
      )
    ),
  Ga = (t) =>
    o.exports.createElement(
      "svg",
      {
        id: "_x32_",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: "16px",
        height: "16px",
        viewBox: "0 0 512 512",
        xmlSpace: "preserve",
        fill: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          null,
          o.exports.createElement("path", {
            d: "M512,224.438c0-63.766-51.703-115.469-115.484-115.469c-8.781,0-17.328,1-25.531,2.859 C365.656,52.984,316.219,6.875,256,6.875c-60.234,0-109.672,46.109-114.984,104.953c-8.219-1.859-16.766-2.859-25.531-2.859 C51.703,108.969,0,160.672,0,224.438c0,47.594,28.797,88.469,69.906,106.141c-10.297,17.281-16.234,37.484-16.234,59.063 c0,63.766,51.703,115.484,115.484,115.484c34.625,0,65.672-15.266,86.844-39.406c21.156,24.141,52.219,39.406,86.844,39.406 c63.781,0,115.484-51.719,115.484-115.484c0-21.578-5.938-41.781-16.25-59.063C483.203,312.906,512,272.031,512,224.438z M256,372.531c-53.563,0-97-43.406-97-97c0-53.563,43.438-96.984,97-96.984s96.984,43.422,96.984,96.984 C352.984,329.125,309.563,372.531,256,372.531z",
          })
        )
      )
    ),
  dt = {
    line_1: [
      { type: q.Bubble, icon: Na },
      { type: q.Star, icon: Aa },
      { type: q.Love, icon: Oa },
      { type: q.Butterfly, icon: _a },
      { type: q.Snow, icon: Ba },
    ],
    line_2: [
      { type: q.Music, icon: Fa },
      { type: q.Sun, icon: Da },
      { type: q.Moon, icon: Wa },
      { type: q.Leaf, icon: Ha },
      { type: q.Flower, icon: Ga },
    ],
  },
  Xa = () => {
    const { drawShape: t, updateDrawShape: e } = f(),
      { t: r } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.shapeType"),
        }),
        Object.keys(dt).map((a) =>
          c(
            "div",
            {
              className: "btn-group mt-1 flex",
              children: dt[a].map(({ type: n, icon: s }) =>
                c(
                  "button",
                  {
                    className: `btn btn-xs flex-grow text-white ${
                      t === n ? "btn-active" : ""
                    }`,
                    onClick: () => {
                      e(n);
                    },
                    children: s({}),
                  },
                  n
                )
              ),
            },
            a
          )
        ),
      ],
    });
  },
  Va = () => {
    const { t } = _(),
      {
        shadowColor: e,
        updateShadowColor: r,
        shadowWidth: a,
        updateShadowWidth: n,
      } = f();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: t("title.shadow"),
        }),
        w("div", {
          className: "flex mt-1 items-center",
          children: [
            c("div", {
              className: "w-7 h-7 cursor-pointer",
              children: c("input", {
                type: "color",
                value: e,
                onChange: (s) => {
                  r(s.target.value);
                },
                className: "colorInput",
              }),
            }),
            c("div", { className: "divider divider-horizontal mx-1" }),
            c("div", {
              className: "text-lg font-fredokaOne mr-2 text-primary-focus",
              children: a,
            }),
            c("input", {
              type: "range",
              min: "0",
              max: "50",
              step: "5",
              value: a,
              className: "range range-primary range-xs cursor-pointer",
              onChange: (s) => n(Number(s.target.value)),
            }),
          ],
        }),
      ],
    });
  },
  fe = {
    georgia: "Georgia",
    fredokaOne: "Fredoka One",
    hanaleiFill: "Hanalei Fill",
    ruslanDisplay: "Ruslan Display",
    lobster: "Lobster",
    pacifico: "Pacifico",
    gloriaHallelujah: "Gloria Hallelujah",
  },
  Tt = ({ fontFamily: t, updateFontFamily: e }) => {
    const { textFontFamily: r, updateTextFontFamily: a } = f(),
      { t: n } = _();
    return w(U, {
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne mt-3",
          children: n("title.fontFamily"),
        }),
        c("div", {
          children: Object.keys(fe).map((s) =>
            w(
              "label",
              {
                className:
                  "flex justify-between items-center mt-2 w-full cursor-pointer",
                children: [
                  c("div", {
                    style: { fontFamily: `${fe[s]}` },
                    className: "text-xs",
                    children: fe[s],
                  }),
                  c("input", {
                    type: "radio",
                    name: "radio-5",
                    className: "radio radio-success radio-sm",
                    checked: (t || r) === fe[s],
                    onChange: () => {
                      a(fe[s]), e == null || e(fe[s]);
                    },
                  }),
                ],
              },
              s
            )
          ),
        }),
      ],
    });
  },
  Ya = () => {
    const { t } = _(),
      { drawTextValue: e, updateDrawTextValue: r } = f();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: t("title.drawText"),
        }),
        c("div", {
          className:
            "flex mt-1 justify-between px-3 py-1.5 rounded-lg bg-primary cursor-pointer",
          children: c("input", {
            value: e,
            className: "px-2 rounded-lg flex-1",
            onInput: (a) => r(a.target.value),
          }),
        }),
        c(Tt, {}),
      ],
    });
  },
  za = [
    { type: Z.CARBON, image: we("pattern/carbon.png") },
    { type: Z.CLOTH, image: we("pattern/cloth.png") },
    { type: Z.CRAYON, image: we("pattern/crayon.png") },
    { type: Z.OIL, image: we("pattern/oil.png") },
    { type: Z.CRAYON_DARK, image: we("pattern/crayonDark.png") },
  ],
  ja = () => {
    const { materialType: t, updateMaterialType: e, drawColors: r } = f(),
      { t: a } = _();
    return c(U, {
      children: w("div", {
        className: "mt-3",
        children: [
          c("div", {
            className: "font-bold text-sm font-fredokaOne",
            children: a("title.materialType"),
          }),
          c("div", {
            className: "btn-group mt-1 flex",
            children: za.map(({ type: n, image: s }, i) =>
              c(
                "button",
                {
                  className: `btn btn-xs flex-grow ${
                    t === n ? "btn-active" : ""
                  }`,
                  onClick: () => {
                    e(n);
                  },
                  children: c("img", {
                    src: s,
                    alt: "",
                    className: "w-5 h-3 opacity-60 rounded-sm",
                    style: { backgroundColor: r[0] },
                  }),
                },
                i
              )
            ),
          }),
        ],
      }),
    });
  },
  Ua = [he.COL, he.ROW, he.CIRCLE],
  $a = () => {
    const { multiColorType: t, updateMultiColorType: e, drawColors: r } = f(),
      { t: a } = _();
    return c(U, {
      children: w("div", {
        className: "mt-3",
        children: [
          c("div", {
            className: "font-bold text-sm font-fredokaOne",
            children: a("title.multiColorType"),
          }),
          c("div", {
            className: "btn-group mt-1 flex",
            children: Ua.map((n, s) =>
              w(
                "button",
                {
                  className: `btn btn-xs flex-grow ${
                    t === n ? "btn-active" : ""
                  }`,
                  onClick: () => {
                    e(n);
                  },
                  children: [
                    n === he.COL &&
                      c("div", {
                        className:
                          "flex w-4/6 h-4/6 rounded-lg overflow-hidden ",
                        children: r.map((i, d) =>
                          c(
                            "div",
                            {
                              className: "h-full flex-1",
                              style: { backgroundColor: i },
                            },
                            d
                          )
                        ),
                      }),
                    n === he.ROW &&
                      c("div", {
                        className:
                          "flex flex-col w-4/6 h-4/6 rounded-lg overflow-hidden ",
                        children: r.map((i, d) =>
                          c(
                            "div",
                            {
                              className: "h-full flex-1",
                              style: { backgroundColor: i },
                            },
                            d
                          )
                        ),
                      }),
                    n === he.CIRCLE &&
                      c("div", {
                        className: "w-4/6 h-4/6 relative",
                        children: r.map((i, d) =>
                          c(
                            "div",
                            {
                              className: "h-4 w-4 rounded-full absolute top-0",
                              style: { backgroundColor: i, left: `${d * 5}px` },
                            },
                            d
                          )
                        ),
                      }),
                  ],
                },
                s
              )
            ),
          }),
        ],
      }),
    });
  },
  Za = () => {
    const { t } = _(),
      { drawWidth: e, updateDrawWidth: r } = f();
    return w("div", {
      className: "mt-2",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: t("title.drawWidth"),
        }),
        w("div", {
          className: "flex items-center",
          children: [
            c("div", {
              className: "text-lg font-fredokaOne mr-2 text-primary-focus",
              children: e,
            }),
            c("input", {
              type: "range",
              min: "5",
              max: "30",
              step: "1",
              value: e,
              className: "range range-primary range-xs",
              onChange: (a) => r(Number(a.target.value)),
            }),
          ],
        }),
      ],
    });
  },
  qa = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "#000000",
        width: "1.75rem",
        height: "1.75rem",
        viewBox: "5 5 22.00 22.00",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("title", null, "add"),
        o.exports.createElement("path", {
          d: "M26.5 27h-3c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h2.5v-2.5c0-0.276 0.224-0.5 0.5-0.5 0.275 0 0.5 0.224 0.5 0.5v3c0 0.276-0.225 0.5-0.5 0.5zM26.5 21c-0.276 0-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5 0.275 0 0.5 0.224 0.5 0.5v3c0 0.276-0.225 0.5-0.5 0.5zM26.5 15c-0.276 0-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5 0.275 0 0.5 0.224 0.5 0.5v3c0 0.276-0.225 0.5-0.5 0.5zM26.5 9c-0.276 0-0.5-0.224-0.5-0.5v-2.5h-2.5c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h3c0.275 0 0.5 0.224 0.5 0.5v3c0 0.276-0.225 0.5-0.5 0.5zM20.5 27h-3c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h3c0.275 0 0.5 0.224 0.5 0.5s-0.225 0.5-0.5 0.5zM20.5 6h-3c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h3c0.275 0 0.5 0.224 0.5 0.5s-0.225 0.5-0.5 0.5zM19.938 15c0.552 0 1 0.447 1 1 0 0.552-0.448 1-1 1h-3v3c0 0.552-0.448 1-1 1-0.553 0-1-0.448-1-1v-3h-3c-0.552 0-1-0.448-1-1 0-0.553 0.447-1 1-1h3v-3c0-0.553 0.447-1 1-1 0.552 0 1 0.447 1 1v3h3zM14.5 6h-3c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h3c0.275 0 0.5 0.224 0.5 0.5s-0.225 0.5-0.5 0.5zM8.5 27h-3c-0.276 0-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5s0.5 0.224 0.5 0.5v2.5h2.5c0.276 0 0.5 0.224 0.5 0.5s-0.224 0.5-0.5 0.5zM8.5 6h-2.5v2.5c0 0.276-0.224 0.5-0.5 0.5s-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5h3c0.276 0 0.5 0.224 0.5 0.5s-0.224 0.5-0.5 0.5zM5.5 11c0.276 0 0.5 0.224 0.5 0.5v3c0 0.276-0.224 0.5-0.5 0.5s-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5zM5.5 17c0.276 0 0.5 0.224 0.5 0.5v3c0 0.276-0.224 0.5-0.5 0.5s-0.5-0.224-0.5-0.5v-3c0-0.276 0.224-0.5 0.5-0.5zM11.5 26h3c0.275 0 0.5 0.224 0.5 0.5s-0.225 0.5-0.5 0.5h-3c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5z",
        })
      )
    ),
  Pt = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "64px",
        height: "64px",
        viewBox: "0 0 16 16",
        xmlns: "http://www.w3.org/2000/svg",
        fill: "#65CC8A",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fill: "#65CC8A",
          fillRule: "evenodd",
          d: "M8,16 C12.4183,16 16,12.4183 16,8 C16,3.58172 12.4183,0 8,0 C3.58172,0 0,3.58172 0,8 C0,12.4183 3.58172,16 8,16 Z M4.29289,4.29289 C4.68342,3.90237 5.31658,3.90237 5.70711,4.29289 L8,6.58579 L10.2929,4.29289 C10.6834,3.90237 11.3166,3.90237 11.7071,4.29289 C12.0976,4.68342 12.0976,5.31658 11.7071,5.70711 L9.41421,8 L11.7071,10.2929 C12.0976,10.6834 12.0976,11.3166 11.7071,11.7071 C11.3166,12.0976 10.6834,12.0976 10.2929,11.7071 L8,9.41421 L5.70711,11.7071 C5.31658,12.0976 4.68342,12.0976 4.29289,11.7071 C3.90237,11.3166 3.90237,10.6834 4.29289,10.2929 L6.58579,8 L4.29289,5.70711 C3.90237,5.31658 3.90237,4.68342 4.29289,4.29289 Z",
        })
      )
    ),
  Ka = () => {
    const { drawColors: t, updateDrawColors: e } = f(),
      { t: r } = _(),
      a = (s, i) => {
        const d = [...t];
        (d[i] = s), e(d);
      },
      n = (s) => {
        const i = [...t];
        i.splice(s, 1), e(i);
      };
    return w("div", {
      className: "form-control mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.drawColor"),
        }),
        w("div", {
          className: "mt-2 flex items-center w-full",
          children: [
            t.map((s, i) =>
              w(
                "div",
                {
                  className: "w-7 h-7 mr-2 relative group",
                  children: [
                    c("input", {
                      type: "color",
                      value: s,
                      onChange: (d) => {
                        a(d.target.value, i);
                      },
                      className: "colorInput",
                    }),
                    t.length > 1 &&
                      c(Pt, {
                        onClick: () => n(i),
                        className:
                          "absolute top-[-6px] right-[-6px] rounded-full w-3 h-3 cursor-pointer inline-block xl:hidden group-hover:inline-block hover:opacity-80",
                      }),
                  ],
                },
                i
              )
            ),
            t.length < 5 &&
              c(qa, {
                className: "cursor-pointer hover:opacity-60",
                onClick: () => {
                  a("#000000", t.length);
                },
              }),
          ],
        }),
      ],
    });
  },
  ht = {
    line_1: [
      { type: k.Basic, text: "style.basic" },
      { type: k.Rainbow, text: "style.rainbow" },
      { type: k.Shape, text: "style.shape" },
    ],
    line_2: [
      { type: k.Material, text: "style.material" },
      { type: k.Pixels, text: "style.pixels" },
      { type: k.MultiColor, text: "style.multiColor" },
    ],
    line_3: [
      { type: k.Text, text: "style.text" },
      { type: k.MultiLine, text: "style.multiLine" },
      { type: k.Reticulate, text: "style.reticulate" },
    ],
    line_4: [
      { type: k.MultiPoint, text: "style.multiPoint" },
      { type: k.Wiggle, text: "style.wiggle" },
      { type: k.Thorn, text: "style.thorn" },
    ],
  },
  Ja = () => {
    const { t } = _(),
      { drawStyle: e, updateDrawStyle: r } = f();
    return w("div", {
      className: "mt-2",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: t("title.drawStyle"),
        }),
        Object.keys(ht).map((a) =>
          c(
            "div",
            {
              className: "btn-group mt-1 flex",
              children: ht[a].map(({ type: n, text: s }) =>
                c(
                  "button",
                  {
                    className: `btn btn-xs flex-grow font-fredokaOne text-xs font-normal ${
                      e === n ? "btn-active font-semibold" : ""
                    }`,
                    onClick: () => r(n),
                    children: t(s),
                  },
                  n
                )
              ),
            },
            a
          )
        ),
      ],
    });
  },
  Qa = () => {
    const { lineType: t, updateLineType: e } = f(),
      { t: r } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.lineType"),
        }),
        Object.keys(Ae).map((a) =>
          c(
            "div",
            {
              className: "btn-group mt-1 flex",
              children: Ae[a].map(({ type: n, icon: s }) =>
                c(
                  "button",
                  {
                    className: `btn btn-xs flex-grow ${
                      t === n ? "btn-active" : ""
                    }`,
                    onClick: () => {
                      e(n);
                    },
                    children: s({}),
                  },
                  n
                )
              ),
            },
            a
          )
        ),
      ],
    });
  },
  en = () => {
    const { drawStyle: t } = f();
    return w(U, {
      children: [
        c(Ja, {}),
        t === k.Shape && c(Xa, {}),
        (t === k.Shape || t === k.MultiPoint) && c(Ra, {}),
        t === k.Material && c(ja, {}),
        t === k.MultiColor && c($a, {}),
        ![k.Text, k.Wiggle, k.Thorn].includes(t) && c(Za, {}),
        t !== k.Rainbow && c(Ka, {}),
        [k.Basic, k.Material, k.MultiColor].includes(t) && c(Qa, {}),
        [k.Basic, k.Material, k.MultiColor].includes(t) && c(Va, {}),
        t === k.Text && c(Ya, {}),
      ],
    });
  },
  Rt = (t) => {
    var i, d, h;
    const { t: e } = _(),
      {
        borderColor: r,
        updateBorderColor: a,
        borderWidth: n,
        updateBorderWidth: s,
      } = W();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: e("title.borderStyle"),
        }),
        w("div", {
          className: "flex mt-1 items-center",
          children: [
            c("div", {
              className: "w-7 h-7 cursor-pointer",
              children: c("input", {
                type: "color",
                value: (i = t == null ? void 0 : t.borderColor) != null ? i : r,
                onChange: (g) => {
                  var m;
                  a(g.target.value),
                    (m = t == null ? void 0 : t.updateBorderColor) == null ||
                      m.call(t, g.target.value);
                },
                className: "colorInput",
              }),
            }),
            c("div", { className: "divider divider-horizontal mx-2" }),
            c("div", {
              className: "text-lg font-fredokaOne mr-2 text-primary-focus",
              children:
                (d = t == null ? void 0 : t.borderWidth) != null ? d : n,
            }),
            c("input", {
              type: "range",
              min: "1",
              max: "20",
              step: "1",
              value: (h = t == null ? void 0 : t.borderWidth) != null ? h : n,
              className: "range range-primary range-xs cursor-pointer",
              onChange: (g) => {
                var m;
                s(Number(g.target.value)),
                  (m = t == null ? void 0 : t.updateBorderWidth) == null ||
                    m.call(t, Number(g.target.value));
              },
            }),
          ],
        }),
      ],
    });
  },
  Nt = (t) => {
    const { borderType: e, updateBorderType: r } = W(),
      { t: a } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: a("title.borderType"),
        }),
        Object.keys(Ae).map((n) =>
          c(
            "div",
            {
              className: "btn-group mt-1 flex",
              children: Ae[n].map(({ type: s, icon: i }) =>
                c(
                  "button",
                  {
                    className: `btn btn-xs flex-grow ${
                      (t.borderType || e) === s ? "btn-active" : ""
                    }`,
                    onClick: () => {
                      var d;
                      r(s),
                        (d = t == null ? void 0 : t.updateBorderType) == null ||
                          d.call(t, s);
                    },
                    children: i({}),
                  },
                  s
                )
              ),
            },
            n
          )
        ),
      ],
    });
  },
  tn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1702136520403,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 1624,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 15,
        height: 15,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M0 0h192v192H0z",
        "p-id": 1625,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M192 192h192v192H192z",
        opacity: 0.6,
        "p-id": 1626,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M384 0h192v192H384z",
        opacity: 0.8,
        "p-id": 1627,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M576 192h192v192H576z",
        opacity: 0.4,
        "p-id": 1628,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M768 0h192v192h-192z",
        opacity: 0.6,
        "p-id": 1629,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M0 384h192v192H0z",
        opacity: 0.8,
        "p-id": 1630,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M192 576h192v192H192zM384 384h192v192H384z",
        opacity: 0.4,
        "p-id": 1631,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M576 576h192v192H576zM768 384h192v192h-192z",
        opacity: 0.2,
        "p-id": 1632,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M0 768h192v192H0z",
        opacity: 0.4,
        "p-id": 1633,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M384 768h192v192H384z",
        opacity: 0.2,
        "p-id": 1634,
        fill: "CURRENTCOLOR",
      }),
      o.exports.createElement("path", {
        d: "M768 768h192v192h-192z",
        opacity: 0.1,
        "p-id": 1635,
        fill: "CURRENTCOLOR",
      })
    ),
  rn = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "currentColor",
        width: "20px",
        height: "20px",
        viewBox: "0 0 32 32",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        xmlSpace: "preserve",
        "xmlns:serif": "http://www.serif.com/",
        style: {
          fillRule: "evenodd",
          clipRule: "evenodd",
          strokeLinejoin: "round",
          strokeMiterlimit: 2,
        },
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M4,29.987l24,0c0.828,0 1.5,-0.672 1.5,-1.5c0,-0.827 -0.672,-1.5 -1.5,-1.5l-24,0c-0.828,0 -1.5,0.673 -1.5,1.5c0,0.828 0.672,1.5 1.5,1.5Z",
        }),
        o.exports.createElement("path", {
          d: "M9.138,22.244c1.323,0.328 2.775,0.118 3.995,-0.702l9.873,-6.712c0.458,-0.308 0.58,-0.929 0.273,-1.388l-6.717,-10c-0.308,-0.458 -0.929,-0.58 -1.388,-0.272c0,-0 -6.027,4.048 -9.961,6.691c-2.293,1.539 -2.903,4.646 -1.363,6.938c0.725,1.08 1.53,2.279 2.256,3.359c0.738,1.099 1.836,1.812 3.032,2.086Zm11.448,-9.223l-15.418,0c0.207,-0.591 0.599,-1.124 1.16,-1.5c-0,-0 9.131,-6.133 9.131,-6.133l5.127,7.633Z",
        }),
        o.exports.createElement("path", {
          d: "M26.339,15.455c-0.185,-0.284 -0.5,-0.455 -0.839,-0.455c-0.339,-0 -0.654,0.171 -0.839,0.455c0,0 -1.274,1.965 -2.039,3.732c-0.379,0.876 -0.622,1.717 -0.622,2.313c-0,1.932 1.568,3.5 3.5,3.5c1.932,0 3.5,-1.568 3.5,-3.5c-0,-0.596 -0.243,-1.437 -0.622,-2.313c-0.765,-1.767 -2.039,-3.732 -2.039,-3.732Z",
        })
      )
    ),
  an = [
    { type: ue.Transparent, icon: tn },
    { type: ue.Full, icon: rn },
  ],
  At = (t) => {
    const { t: e } = _(),
      {
        fillColor: r,
        updateFillColor: a,
        fillType: n,
        updateFillType: s,
      } = W();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: e("title.fillStyle"),
        }),
        w("div", {
          className: "flex mt-1 items-center",
          children: [
            c("div", {
              className: "w-7 h-7 cursor-pointer",
              children: c("input", {
                type: "color",
                value: (t == null ? void 0 : t.fillColor) || r,
                onChange: (i) => {
                  var d;
                  a(i.target.value),
                    (d = t == null ? void 0 : t.updateFillColor) == null ||
                      d.call(t, i.target.value);
                },
                className: "colorInput",
              }),
            }),
            c("div", { className: "divider divider-horizontal mx-2" }),
            c("div", {
              className: "tabs tabs-boxed bg-[#333C4D] flex",
              children: an.map(({ type: i, icon: d }) =>
                c(
                  "button",
                  {
                    className: `tab tab-xs flex-grow text-[#eef1ff] ${
                      ((t == null ? void 0 : t.fillType) || n) === i
                        ? "tab-active"
                        : ""
                    }`,
                    onClick: () => {
                      var h;
                      s(i),
                        (h = t == null ? void 0 : t.updateFillType) == null ||
                          h.call(t, i);
                    },
                    children: d({}),
                  },
                  i
                )
              ),
            }),
          ],
        }),
      ],
    });
  },
  nn = () => {
    const { shapeLinePointCount: t, updateShapeLinePointCount: e } = W(),
      { t: r } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.shapeLinePointCount"),
        }),
        c("input", {
          type: "range",
          min: "2",
          max: "5",
          value: t,
          className: "range range-primary range-xs mt-1",
          step: "1",
          onChange: (a) => e(Number(a.target.value)),
        }),
        w("div", {
          className: "w-full flex justify-between text-xs px-2 font-fredokaOne",
          children: [
            c("span", { children: "2" }),
            c("span", { children: "3" }),
            c("span", { children: "4" }),
            c("span", { children: "5" }),
          ],
        }),
      ],
    });
  },
  sn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fillRule: "evenodd",
          clipRule: "evenodd",
          d: "M18 5C17.4477 5 17 5.44772 17 6C17 6.27642 17.1108 6.52505 17.2929 6.70711C17.475 6.88917 17.7236 7 18 7C18.5523 7 19 6.55228 19 6C19 5.44772 18.5523 5 18 5ZM15 6C15 4.34315 16.3431 3 18 3C19.6569 3 21 4.34315 21 6C21 7.65685 19.6569 9 18 9C17.5372 9 17.0984 8.8948 16.7068 8.70744L8.70744 16.7068C8.8948 17.0984 9 17.5372 9 18C9 19.6569 7.65685 21 6 21C4.34315 21 3 19.6569 3 18C3 16.3431 4.34315 15 6 15C6.46278 15 6.90157 15.1052 7.29323 15.2926L15.2926 7.29323C15.1052 6.90157 15 6.46278 15 6ZM6 17C5.44772 17 5 17.4477 5 18C5 18.5523 5.44772 19 6 19C6.55228 19 7 18.5523 7 18C7 17.7236 6.88917 17.475 6.70711 17.2929C6.52505 17.1108 6.27642 17 6 17Z",
          fill: "currentColor",
        })
      )
    ),
  on = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M3 6.6C3 6.03995 3 5.75992 3.10899 5.54601C3.20487 5.35785 3.35785 5.20487 3.54601 5.10899C3.75992 5 4.03995 5 4.6 5H10.4C10.9601 5 11.2401 5 11.454 5.10899C11.6422 5.20487 11.7951 5.35785 11.891 5.54601C12 5.75992 12 6.03995 12 6.6V8.4C12 8.96005 12 9.24008 11.891 9.45399C11.7951 9.64215 11.6422 9.79513 11.454 9.89101C11.2401 10 10.9601 10 10.4 10H4.6C4.03995 10 3.75992 10 3.54601 9.89101C3.35785 9.79513 3.20487 9.64215 3.10899 9.45399C3 9.24008 3 8.96005 3 8.4V6.6Z",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M5 15.6C5 15.0399 5 14.7599 5.10899 14.546C5.20487 14.3578 5.35785 14.2049 5.54601 14.109C5.75992 14 6.03995 14 6.6 14H10.4C10.9601 14 11.2401 14 11.454 14.109C11.6422 14.2049 11.7951 14.3578 11.891 14.546C12 14.7599 12 15.0399 12 15.6V17.4C12 17.9601 12 18.2401 11.891 18.454C11.7951 18.6422 11.6422 18.7951 11.454 18.891C11.2401 19 10.9601 19 10.4 19H6.6C6.03995 19 5.75992 19 5.54601 18.891C5.35785 18.7951 5.20487 18.6422 5.10899 18.454C5 18.2401 5 17.9601 5 17.4V15.6Z",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M16 6.6C16 6.03995 16 5.75992 16.109 5.54601C16.2049 5.35785 16.3578 5.20487 16.546 5.10899C16.7599 5 17.0399 5 17.6 5H19.4C19.9601 5 20.2401 5 20.454 5.10899C20.6422 5.20487 20.7951 5.35785 20.891 5.54601C21 5.75992 21 6.03995 21 6.6V14.4C21 14.9601 21 15.2401 20.891 15.454C20.7951 15.6422 20.6422 15.7951 20.454 15.891C20.2401 16 19.9601 16 19.4 16H17.6C17.0399 16 16.7599 16 16.546 15.891C16.3578 15.7951 16.2049 15.6422 16.109 15.454C16 15.2401 16 14.9601 16 14.4V6.6Z",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  cn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z",
          stroke: "currentColor",
          strokeWidth: 2,
        })
      )
    ),
  ln = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705756373807,
        className: "icon",
        viewBox: "0 0 1066 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 15154,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 25,
        height: 20,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M298.24 366.506667C236.373333 407.68 204.8 459.946667 204.8 512c0 52.010667 31.573333 104.277333 93.44 145.493333 61.610667 41.045333 149.12 67.84 247.893333 67.84 98.773333 0 186.282667-26.794667 247.893334-67.84 61.866667-41.216 93.44-93.482667 93.44-145.493333 0-52.010667-31.573333-104.277333-93.44-145.493333C732.373333 325.376 644.864 298.666667 546.133333 298.666667c-98.773333 0-186.282667 26.752-247.893333 67.84zM250.965333 295.424C328.362667 243.84 432.853333 213.333333 546.133333 213.333333c113.28 0 217.770667 30.549333 295.210667 82.133334C918.442667 346.88 972.8 422.613333 972.8 512s-54.357333 165.12-131.456 216.533333C763.904 780.16 659.413333 810.666667 546.133333 810.666667c-113.28 0-217.770667-30.549333-295.210666-82.133334C173.824 677.12 119.466667 601.386667 119.466667 512s54.357333-165.12 131.456-216.533333z",
        fill: "currentColor",
        "p-id": 15155,
      })
    ),
  dn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          { id: "Shape / Triangle" },
          o.exports.createElement("path", {
            id: "Vector",
            d: "M4.37891 15.1999C3.46947 16.775 3.01489 17.5634 3.08281 18.2097C3.14206 18.7734 3.43792 19.2851 3.89648 19.6182C4.42204 20.0001 5.3309 20.0001 7.14853 20.0001H16.8515C18.6691 20.0001 19.5778 20.0001 20.1034 19.6182C20.5619 19.2851 20.8579 18.7734 20.9172 18.2097C20.9851 17.5634 20.5307 16.775 19.6212 15.1999L14.7715 6.79986C13.8621 5.22468 13.4071 4.43722 12.8135 4.17291C12.2957 3.94236 11.704 3.94236 11.1862 4.17291C10.5928 4.43711 10.1381 5.22458 9.22946 6.79845L4.37891 15.1999Z",
            stroke: "currentColor",
            strokeWidth: 2,
            strokeLinecap: "round",
            strokeLinejoin: "round",
          })
        )
      )
    ),
  hn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          { id: "Arrow / Arrow_Down_Up" },
          o.exports.createElement("path", {
            id: "Vector",
            d: "M11 16L8 19M8 19L5 16M8 19V5M13 8L16 5M16 5L19 8M16 5V19",
            stroke: "currentColor",
            strokeWidth: 2,
            strokeLinecap: "round",
            strokeLinejoin: "round",
          })
        )
      )
    ),
  pn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "-11.98 -11.98 143.74 143.74",
        xmlns: "http://www.w3.org/2000/svg",
        fill: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("defs", null),
        o.exports.createElement(
          "g",
          { id: "Layer_2", "data-name": "Layer 2" },
          o.exports.createElement(
            "g",
            { id: "Layer_1-2", "data-name": "Layer 1" },
            o.exports.createElement("path", {
              d: "M60.3,78.46c-.31,5-.39,9-.82,12.91-.86,7.85-7.86,11.57-14.92,7.85A63.53,63.53,0,0,1,34.4,92.84Q19.67,81,5.29,68.78C-.35,64-1.3,58.65,1.58,51.82a30.86,30.86,0,0,1,2.19-4.65A302.23,302.23,0,0,1,31.91,9.31a48.7,48.7,0,0,1,7.64-6.84C46-2.3,51.84,0,53.52,7.92a65.45,65.45,0,0,1,.78,7.69c.14,1.66.24,3.33.4,5.53a32.54,32.54,0,0,0,4.39.14c7.11-.83,14.18-2.09,21.3-2.57a246.17,246.17,0,0,1,24.89-.54c7.68.26,11.38,3.91,12.77,11.46a112.58,112.58,0,0,1,1.63,24.8c-.05,1.42-.31,2.84-.49,4.25-1,8.35-5.08,13.81-14,14.64a17.63,17.63,0,0,0-4.09,1.24A65.73,65.73,0,0,1,78.3,78.24C72.6,78.16,66.9,78.37,60.3,78.46ZM43.47,14c-9,5.63-27.46,31.38-32.4,44.91,10.7,9.07,21.55,18.33,32.52,27.45,1.38,1.15,3.39,1.55,5.33,2.4,1.38-4.27.25-8,.35-11.62.13-4.81.95-6.57,5.41-7.27,5-.8,10.21-.76,15.33-1,7.4-.41,14.84-.49,22.2-1.28a39.24,39.24,0,0,0,16.08-5c2.55-12.13,1.56-25-2.65-33.79-4.31-1.14-8.87-1.08-13.42-.95-10.86.31-21.7.61-32.42,2.73-5.51,1.09-10.8.41-15.4-3.89C44.12,22.77,43.83,18.81,43.47,14Z",
            })
          )
        )
      )
    ),
  un = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M3 13.6493C3 16.6044 5.41766 19 8.4 19L16.5 19C18.9853 19 21 16.9839 21 14.4969C21 12.6503 19.8893 10.9449 18.3 10.25C18.1317 7.32251 15.684 5 12.6893 5C10.3514 5 8.34694 6.48637 7.5 8.5C4.8 8.9375 3 11.2001 3 13.6493Z",
          stroke: "currentColor",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  gn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 0 24 24",
        xmlns: "http://www.w3.org/2000/svg",
        fill: "none",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          stroke: "currentColor",
          strokeLinecap: "round",
          strokeLinejoin: "round",
          strokeWidth: 2,
          d: "M20 10h-8a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h.93a2 2 0 0 1 1.664.89l.574.862a1 1 0 0 0 1.664 0l.574-.861A2 2 0 0 1 19.07 20H20a2 2 0 0 0 2-2v-6a2 2 0 0 0-2-2zm-6-3V4a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h.93a2 2 0 0 1 1.664.89L7 13.5",
        })
      )
    ),
  mn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705816188032,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 11440,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 18,
        height: 18,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M508.746667 299.2L485.333333 452.373333a5.333333 5.333333 0 0 0 4 5.973334l217.386667 53.333333a5.333333 5.333333 0 0 1 2.72 8.693333l-184.906667 208.8a5.333333 5.333333 0 0 1-9.28-4.32l23.413334-153.226666a5.333333 5.333333 0 0 0-4-5.973334L317.173333 512a5.333333 5.333333 0 0 1-2.506666-8.48l184.8-208.693333a5.333333 5.333333 0 0 1 9.28 4.373333z m-329.493334 256l271.253334 66.666667a5.333333 5.333333 0 0 1 4 5.973333l-51.04 335.68a5.333333 5.333333 0 0 0 9.226666 4.32l434.773334-490.346667a5.333333 5.333333 0 0 0-2.72-8.693333l-271.253334-66.666667a5.333333 5.333333 0 0 1-4-5.973333l51.04-335.626667a5.333333 5.333333 0 0 0-9.226666-4.373333L176.533333 546.506667a5.333333 5.333333 0 0 0 2.72 8.693333z",
        "p-id": 11441,
        fill: "currentColor",
      })
    ),
  fn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705817265217,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 12421,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M851.456 755.419429q0 22.820571-16.018286 38.838857l-77.677714 77.677714q-16.018286 16.018286-38.838857 16.018286t-38.838857-16.018286l-168.009143-168.009143-168.009143 168.009143q-16.018286 16.018286-38.838857 16.018286t-38.838857-16.018286l-77.677714-77.677714q-16.018286-16.018286-16.018286-38.838857t16.018286-38.838857l168.009143-168.009143-168.009143-168.009143q-16.018286-16.018286-16.018286-38.838857t16.018286-38.838857l77.677714-77.677714q16.018286-16.018286 38.838857-16.018286t38.838857 16.018286l168.009143 168.009143 168.009143-168.009143q16.018286-16.018286 38.838857-16.018286t38.838857 16.018286l77.677714 77.677714q16.018286 16.018286 16.018286 38.838857t-16.018286 38.838857l-168.009143 168.009143 168.009143 168.009143q16.018286 16.018286 16.018286 38.838857z",
        fill: "currentColor",
        "p-id": 12422,
      })
    ),
  wn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705817679376,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 15379,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M918.8 83.7c-43.5-30.3-104-19.5-134.6 24.1l-425.8 606-127-135.7c-36.4-38.9-98.1-41.1-137-4.8-39 36.2-41.1 97.7-4.7 136.6l206.5 220.7c4.7 5 9.8 9.4 15.1 13.1 0.7 0.5 1.4 1 2.2 1.5 43.5 30.3 104 19.5 134.6-24.1l494-703.2c30.7-43.5 20.1-103.9-23.3-134.2z",
        fill: "currentColor",
        "p-id": 15380,
      })
    ),
  xn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705818171661,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 16367,
        width: 16,
        height: 16,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        ...t,
      },
      o.exports.createElement("path", {
        d: "M512 1024c282.771 0 512-229.23 512-512s-229.23-512-512-512-512 229.23-512 512 229.23 512 512 512zM432 256c0-44.183 35.817-80 80-80s80 35.817 80 80v31.999c0 44.183-35.817 80-80 80s-80-35.817-80-80v-31.999zM431.999 512c0-44.183 35.817-80 80-80s80 35.817 80 80v256c0 44.183-35.817 80-80 80s-80-35.817-80-80v-256z",
        "p-id": 16368,
        fill: "currentColor",
      })
    ),
  Cn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705818590143,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 15111,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 18,
        height: 18,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M800 170.666667a138.666667 138.666667 0 0 1 138.453333 130.816L938.666667 309.333333v405.333334a138.666667 138.666667 0 0 1-130.816 138.453333L800 853.333333h-362.709333a138.666667 138.666667 0 0 1-88.96-32.256l-6.613334-5.930666-213.162666-202.666667a138.666667 138.666667 0 0 1-4.906667-196.010667l4.906667-4.949333 213.162666-202.666667a138.666667 138.666667 0 0 1 86.698667-37.888L437.290667 170.666667h362.666666z m0 64h-362.709333a74.666667 74.666667 0 0 0-46.08 15.872l-5.376 4.693333-213.162667 202.666667-2.645333 2.645333a74.666667 74.666667 0 0 0-2.346667 100.352l4.992 5.205333 213.162667 202.666667c12.117333 11.52 27.733333 18.645333 44.288 20.224l7.168 0.341333h362.666666a74.666667 74.666667 0 0 0 74.453334-68.565333l0.256-6.101333v-405.333334a74.666667 74.666667 0 0 0-68.565334-74.410666L800 234.666667z m-311.637333 123.605333l3.584 3.114667L597.333333 466.730667l105.386667-105.386667a32 32 0 0 1 48.341333 41.685333l-3.114666 3.584L642.56 512l105.386667 105.386667a32 32 0 0 1-41.642667 48.341333l-3.584-3.114667L597.333333 557.269333l-105.386666 105.386667a32 32 0 0 1-48.341334-41.685333l3.072-3.584L552.106667 512l-105.386667-105.386667a32 32 0 0 1 41.685333-48.341333z",
        fill: "currentColor",
        "p-id": 15112,
      })
    ),
  vn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705819045470,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 15265,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M512 85.333333c235.648 0 426.666667 191.061333 426.666667 426.666667 0 235.690667-191.018667 426.666667-426.666667 426.666667-235.605333 0-426.666667-190.976-426.666667-426.666667C85.333333 276.437333 276.394667 85.333333 512 85.333333z m0 64a362.666667 362.666667 0 1 0 0 725.333334 362.666667 362.666667 0 0 0 0-725.333334z m-181.333333 330.666667h362.666666a32 32 0 0 1 4.352 63.701333l-4.352 0.298667h-362.666666a32 32 0 0 1-4.352-63.701333l4.352-0.298667h362.666666-362.666666z",
        fill: "currentColor",
        "p-id": 15266,
      })
    ),
  bn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705819674136,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 16477,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M731.428571 905.216c29.147429 0 50.139429-21.430857 50.139429-50.139429V171.501714c0-28.708571-20.992-52.717714-50.998857-52.717714-20.992 0-34.706286 10.294857-57.856 30.866286l-201.435429 178.706285c-2.56 2.56-6.418286 3.858286-10.697143 3.858286h-127.286857c-60.873143 0-90.88 30.427429-90.88 95.140572V597.942857c0 64.731429 30.006857 95.140571 90.88 95.140572h127.268572c4.297143 0 8.155429 1.28 10.715428 3.858285L672.731429 877.348571c20.992 18.870857 37.723429 27.867429 58.715428 27.867429z m-24.868571-90.422857c-2.139429 0-4.699429-1.28-7.277714-3.858286L509.44 639.926857c-10.276571-9.435429-18.834286-11.574857-30.427429-11.574857h-142.701714c-16.713143 0-24.868571-7.716571-24.868571-24.868571v-181.705143c0-16.713143 8.155429-24.850286 24.868571-24.850286h142.701714c11.574857 0 19.712-1.718857 30.427429-11.574857l189.860571-172.288c2.139429-1.700571 4.717714-3.419429 7.296-3.419429 3.84 0 5.997714 2.56 5.997715 5.997715v592.713142c0 3.858286-2.139429 6.436571-5.997715 6.436572z",
        "p-id": 16478,
        fill: "currentColor",
      })
    ),
  Sn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705820436292,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 1989,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M426.666667 117.333333a309.333333 309.333333 0 0 1 240.213333 504.277334l209.066667 209.066666a32 32 0 0 1-41.642667 48.384l-3.584-3.114666-209.109333-209.066667A309.333333 309.333333 0 1 1 426.666667 117.333333z m0 64a245.333333 245.333333 0 1 0 0 490.666667 245.333333 245.333333 0 0 0 0-490.666667z",
        fill: "currentColor",
        "p-id": 1990,
      })
    ),
  yn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "20px",
        height: "20px",
        viewBox: "0 -68.62 309.13 309.13",
        xmlns: "http://www.w3.org/2000/svg",
        fill: "currentColor",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("defs", null),
        o.exports.createElement(
          "g",
          { id: "Layer_2", "data-name": "Layer 2" },
          o.exports.createElement(
            "g",
            { id: "Layer_1-2", "data-name": "Layer 1" },
            o.exports.createElement("path", {
              d: "M89.68,0c16.93,12.78,35.09,21,56.38,20.55,2.3,0,4.59-.06,6.88.07a64.3,64.3,0,0,0,35.55-7.85c4.37-2.42,8.6-2.67,13.2-1.85a8.08,8.08,0,0,1,5.09,2.86c12,14.42,27.73,20.48,46.19,20.6,8.12,0,16-.64,23.46-4.15a13.82,13.82,0,0,1,5.81-1c2.25,0,4.13,2.72,3.63,4.92a26.24,26.24,0,0,1-1.32,3.12c-4.65,12.17-1.88,23.2,5.92,33,2.17,2.71,6.09,4.07,9.32,5.86,2.49,1.38,5.26,2.26,7.68,3.74a3.54,3.54,0,0,1,.19,5.87,20.31,20.31,0,0,1-2.87,1.84c-14.12,7.91-20.69,21-23.88,36-1.13,5.36.93,10.75,2.65,15.94a57.2,57.2,0,0,1,2.28,7.35c.63,3.33-1.25,5.55-4.74,5.64a33.64,33.64,0,0,1-6.76-.74c-19-3.33-36.39.36-51.73,12.4-2.24,1.76-4.26,3.83-6.44,5.67-2.93,2.47-5.43,2.7-8.59.86a15.43,15.43,0,0,1-2.1-1.5c-6.69-5.62-14.73-7.23-23.14-8-13.19-1.23-25.78,1.36-37.68,6.62-6.7,3-11.49.84-16.33-3.12-2.65-2.18-5.15-4.55-7.64-6.91a24.73,24.73,0,0,0-12.93-6.4c-15.06-2.69-30.13-3.61-45.11.76-4.93,1.44-10,2.46-14.87,4.11s-8.33-.65-11.48-3.67c-.87-.83-1-2.56-1.19-3.92-.87-5.65-1.52-11.33-2.46-17a24.82,24.82,0,0,0-12.9-18.3c-4.95-2.78-9.12-7.08-15.62-7.77L0,98c3.06-2.94,5.88-5.71,8.77-8.4,10.63-9.91,14.4-22.38,13.5-36.5A10.73,10.73,0,0,0,20,47.79c-2.75-3.66-2.57-7.3-.65-11.71,6.28.84,12.44,1.81,18.63,2.47C48,39.61,57.26,37,66.25,32.92A36.86,36.86,0,0,0,80.61,21.1c1.8-2.39,3.17-5,3.15-7.8,0-4.54,2.41-8.06,4-11.93C88,.93,88.7.7,89.68,0ZM194.84,20.36c-15.43,9.11-32.61,10.91-50.33,10.35s-34.57-4-49.91-13.77c-1.85,2.88-3.4,5.25-4.9,7.64a45.12,45.12,0,0,1-19,17c-9.12,4.34-18.77,7-29,6.82-2.49,0-5,.21-7.58.33-1.24,4.16-.63,7.9-.72,11.56A44.6,44.6,0,0,1,17.54,94.14c-1,.85-2.52,1.5-1.94,3.56,4.17,2.69,8.46,5.52,12.8,8.24a34.44,34.44,0,0,1,15,20.23c1,3.26,1.18,6.74,1.75,10.11.47,2.76,0,5.82,2.82,8.21a20.18,20.18,0,0,0,3.86-.54,90.34,90.34,0,0,1,31.26-4.72c8,.32,16,.8,24,1.71,10.57,1.22,19.9,5.19,26.92,13.63a33.67,33.67,0,0,0,4.06,3.5c24-8,48-11.37,71.22-.21,5.26-3,9.8-6,14.66-8.33a99.28,99.28,0,0,1,15.19-5.81,104.18,104.18,0,0,1,16-3.1c5.26-.64,10.6-.6,16.3-.87a55.92,55.92,0,0,0-1.45-7.14c-1.8-5.13-1-10.05.25-15.17a66,66,0,0,1,16.47-29.69c1.3-1.39,2.5-2.86,3.56-4.08-3.62-3.09-7.22-5.55-10-8.71a37.14,37.14,0,0,1-9.39-25.18c0-2.21.67-4.61-1.41-6.57a126.89,126.89,0,0,1-31.51-.33,59.93,59.93,0,0,1-29.87-12C203.69,27.6,199.53,24.12,194.84,20.36Z",
            }),
            o.exports.createElement("path", {
              d: "M194.84,20.36c4.69,3.76,8.85,7.24,13.15,10.53a59.93,59.93,0,0,0,29.87,12,126.89,126.89,0,0,0,31.51.33c2.08,2,1.39,4.36,1.41,6.57A37.14,37.14,0,0,0,280.17,75c2.81,3.16,6.41,5.62,10,8.71-1.06,1.22-2.26,2.69-3.56,4.08a66,66,0,0,0-16.47,29.69c-1.28,5.12-2.05,10-.25,15.17a55.92,55.92,0,0,1,1.45,7.14c-5.7.27-11,.23-16.3.87a104.18,104.18,0,0,0-16,3.1,99.28,99.28,0,0,0-15.19,5.81c-4.86,2.32-9.4,5.31-14.66,8.33C186,146.7,162,150.06,138,158.07a33.67,33.67,0,0,1-4.06-3.5c-7-8.44-16.35-12.41-26.92-13.63-7.94-.91-16-1.39-24-1.71A90.34,90.34,0,0,0,51.83,144a20.18,20.18,0,0,1-3.86.54c-2.84-2.39-2.35-5.45-2.82-8.21-.57-3.37-.79-6.85-1.75-10.11a34.44,34.44,0,0,0-15-20.23c-4.34-2.72-8.63-5.55-12.8-8.24-.58-2.06,1-2.71,1.94-3.56A44.6,44.6,0,0,0,33.4,60.26c.09-3.66-.52-7.4.72-11.56,2.6-.12,5.09-.37,7.58-.33,10.26.16,19.91-2.48,29-6.82a45.12,45.12,0,0,0,19-17c1.5-2.39,3-4.76,4.9-7.64,15.34,9.79,32.21,13.21,49.91,13.77S179.41,29.47,194.84,20.36Z",
            })
          )
        )
      )
    ),
  kn = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705821505982,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 2318,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M760.384 64c47.808 0 91.968 11.968 132.352 35.84a264.32 264.32 0 0 1 95.872 97.152A263.68 263.68 0 0 1 1024 330.88c0 34.752-6.592 68.544-19.712 101.312a262.4 262.4 0 0 1-57.536 87.424L512 960 77.248 519.68A268.8 268.8 0 0 1 0 330.88c0-48.384 11.776-93.056 35.392-133.952A264.32 264.32 0 0 1 131.2 99.84 255.296 255.296 0 0 1 263.68 64 260.736 260.736 0 0 1 449.92 142.208l62.08 62.912 62.144-62.912a258.944 258.944 0 0 1 86.336-58.24A259.584 259.584 0 0 1 760.512 64h-0.128z",
        fill: "currentColor",
        "p-id": 2319,
      })
    ),
  Ln = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1705823230352,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 3291,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 16,
        height: 16,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M877.714286 658.285714 877.714286 365.714286C877.714286 163.766857 713.947429 0 512 0 310.052571 0 146.285714 163.766857 146.285714 365.714286L146.285714 658.285714 0 950.857143 409.014857 950.857143C424.118857 993.389714 464.274286 1024 512 1024 559.725714 1024 599.881143 993.389714 614.985143 950.857143L1024 950.857143 877.714286 658.285714",
        fill: "currentColor",
        "p-id": 3292,
      })
    ),
  pt = {
    line_1: [
      { type: N.Line, icon: sn },
      { type: N.Rect, icon: on },
      { type: N.Circle, icon: cn },
      { type: N.Ellipse, icon: ln },
      { type: N.Triangle, icon: dn },
    ],
    line_2: [
      { type: N.ArrowLine, icon: hn },
      { type: N.ArrowOutline, icon: pn },
      { type: N.Cloud, icon: un },
      { type: N.Tooltips, icon: gn },
      { type: N.Lightning, icon: mn },
    ],
    line_3: [
      { type: N.Close, icon: fn },
      { type: N.Check, icon: wn },
      { type: N.Info, icon: xn },
      { type: N.Backspace, icon: Cn },
      { type: N.Block, icon: vn },
    ],
    line_4: [
      { type: N.Speaker, icon: bn },
      { type: N.Search, icon: Sn },
      { type: N.InfoOutline, icon: yn },
      { type: N.Heart, icon: kn },
      { type: N.Alert, icon: Ln },
    ],
  },
  En = () => {
    const { shapeStyle: t, updateShapeStyle: e } = W(),
      { t: r } = _();
    return w("div", {
      className: "mt-3",
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne",
          children: r("title.shapeType"),
        }),
        Object.keys(pt).map((a) =>
          c(
            "div",
            {
              className: "btn-group mt-1 flex",
              children: pt[a].map(({ type: n, icon: s }) =>
                c(
                  "button",
                  {
                    className: `btn btn-xs flex-grow text-[#eef1ff] ${
                      t === n ? "btn-active" : ""
                    }`,
                    onClick: () => {
                      e(n);
                    },
                    children: s({}),
                  },
                  n
                )
              ),
            },
            a
          )
        ),
      ],
    });
  },
  Mn = () => {
    const { shapeStyle: t } = W(),
      e = o.exports.useMemo(() => [N.Line, N.ArrowLine].includes(t), [t]);
    return w(U, {
      children: [
        c(En, {}),
        e && c(nn, {}),
        c(Nt, {}),
        c(Rt, {}),
        !e && c(At, {}),
      ],
    });
  },
  In = () => {
    const { t } = _(),
      { drawType: e, updateDrawType: r } = O();
    return w(U, {
      children: [
        c("div", {
          className: "font-bold text-sm font-fredokaOne mt-2",
          children: t("title.drawType"),
        }),
        c("div", {
          className: "btn-group flex mt-1",
          children: Pa.map(({ type: a, text: n }) =>
            c(
              "button",
              {
                className: `btn btn-xs flex-grow font-fredokaOne font-normal ${
                  e === a ? "btn-active font-semibold" : ""
                }`,
                onClick: () => {
                  r(a);
                },
                children: t(n),
              },
              a
            )
          ),
        }),
        e === ge.FreeStyle && c(en, {}),
        e === ge.Shape && c(Mn, {}),
      ],
    });
  },
  Tn = () => {
    const { t } = _(),
      { eraserWidth: e, updateEraserWidth: r } = f();
    return c(U, {
      children: w("div", {
        className: "mt-3",
        children: [
          c("div", {
            className: "font-bold text-sm font-fredokaOne",
            children: t("title.eraserWidth"),
          }),
          w("div", {
            className: "flex items-center",
            children: [
              c("div", {
                className: "text-lg font-fredokaOne mr-2 text-primary-focus",
                children: e,
              }),
              c("input", {
                type: "range",
                min: "5",
                max: "50",
                step: "1",
                value: e,
                className: "range range-primary range-xs",
                onChange: (a) => r(Number(a.target.value)),
              }),
            ],
          }),
        ],
      }),
    });
  },
  Pn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "36px",
        height: "36px",
        viewBox: "0 0 76 76",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        baseProfile: "full",
        enableBackground: "new 0 0 76.00 76.00",
        xmlSpace: "preserve",
        fill: "#66CC89",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fill: "#66CC89",
          fillOpacity: 1,
          strokeWidth: 0.2,
          strokeLinejoin: "round",
          d: "M 58.5835,58.5836L 53.0417,58.5836L 58.5835,53.0418L 58.5835,58.5836 Z M 34.0418,52.2504L 30.0836,56.2086L 30.0836,52.2503L 34.0418,52.2504 Z M 41.9584,52.2504L 35.6253,58.5835L 30.0836,58.5835L 30.0833,57.7918L 35.6249,52.2504L 41.9584,52.2504 Z M 49.8746,52.2504L 43.5419,58.5835L 37.2085,58.5835L 43.5415,52.2504L 49.8746,52.2504 Z M 58.5835,45.1241L 58.5835,51.4587L 51.4586,58.5835L 45.125,58.5835L 58.5835,45.1241 Z M 52.2504,34.0418L 52.2503,30.0835L 56.2087,30.0836L 52.2504,34.0418 Z M 58.5835,35.6253L 52.2504,41.9584L 52.2504,35.6249L 57.7918,30.0833L 58.5835,30.0836L 58.5835,35.6253 Z M 58.5835,43.541L 52.2504,49.8745L 52.2504,43.5415L 58.5835,37.2084L 58.5835,43.541 Z M 19,50.6667L 19,19L 50.6667,19L 50.6671,50.6661L 19,50.6667 Z ",
        })
      )
    ),
  Rn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "36px",
        height: "36px",
        viewBox: "0 0 76 76",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        baseProfile: "full",
        enableBackground: "new 0 0 76.00 76.00",
        xmlSpace: "preserve",
        fill: "#66CC89",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fill: "#66CC89",
          fillOpacity: 1,
          strokeWidth: 0.2,
          strokeLinejoin: "round",
          d: "M 19,50.6667L 19,19L 50.6667,19L 50.6668,28.5003L 28.5,28.5002L 28.5,50.6667L 19,50.6667 Z M 58.5835,58.5836L 53.0415,58.5833L 58.5833,53.0416L 58.5835,58.5836 Z M 58.5833,45.1249L 58.5833,51.4585L 51.4584,58.5833L 45.1249,58.5833L 58.5833,45.1249 Z M 58.5833,35.6251L 35.6251,58.5834L 30.0833,58.5834L 30.0833,57.7918L 57.7918,30.0834L 58.5835,30.0836L 58.5833,35.6251 Z M 58.5833,43.5418L 43.5418,58.5833L 37.2082,58.5833L 58.5833,37.2082L 58.5833,43.5418 Z M 56.2084,30.0833L 30.0833,56.2085L 30.0833,49.8749L 49.8749,30.0834L 56.2084,30.0833 Z M 48.2918,30.0834L 30.0833,48.2918L 30.0833,41.9582L 41.9582,30.0834L 48.2918,30.0834 Z M 40.3751,30.0833L 30.0833,40.3751L 30.0833,34.0416L 34.0415,30.0833L 40.3751,30.0833 Z ",
        })
      )
    ),
  Nn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "36px",
        height: "36px",
        viewBox: "0 0 76 76",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        baseProfile: "full",
        enableBackground: "new 0 0 76.00 76.00",
        xmlSpace: "preserve",
        fill: "#66CC89",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fill: "#66CC89",
          fillOpacity: 1,
          strokeWidth: 0.2,
          strokeLinejoin: "round",
          d: "M 50.6667,25.3333L 50.6667,50.6667L 25.3333,50.6667L 25.3333,25.3333L 50.6667,25.3333 Z M 17.4169,17.417L 19.7919,17.417L 17.4169,19.7921L 17.4169,17.417 Z M 27.7088,17.417L 17.4168,27.709L 17.4168,21.3752L 21.3751,17.417L 27.7088,17.417 Z M 36.417,18.6045L 36.4168,23.7503L 30.8754,23.7503L 36.0213,18.6045L 36.417,18.6045 Z M 18.6043,36.4173L 18.6043,36.0216L 23.7502,30.8755L 23.7502,36.417L 18.6043,36.4173 Z M 17.4168,29.2924L 29.2919,17.417L 35.6255,17.417L 29.2922,23.7503L 23.7502,23.7503L 23.7502,29.2923L 17.4168,35.6257L 17.4168,29.2924 Z M 58.5833,58.5833L 56.2082,58.5833L 58.5833,56.2082L 58.5833,58.5833 Z M 48.2914,58.5833L 58.5833,48.2913L 58.5833,54.6251L 54.6251,58.5833L 48.2914,58.5833 Z M 39.5832,57.3958L 39.5833,52.25L 45.1248,52.25L 39.9788,57.3958L 39.5832,57.3958 Z M 57.3959,39.583L 57.3959,39.9787L 52.25,45.1248L 52.25,39.5833L 57.3959,39.583 Z M 58.5833,46.708L 46.7082,58.5833L 40.3747,58.5833L 46.708,52.25L 52.25,52.25L 52.25,46.708L 58.5833,40.3746L 58.5833,46.708 Z ",
        })
      )
    ),
  An = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "36px",
        height: "36px",
        viewBox: "0 0 76 76",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        baseProfile: "full",
        enableBackground: "new 0 0 76.00 76.00",
        xmlSpace: "preserve",
        fill: "#66CC89",
        stroke: "#66CC89",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fill: "#66CC89",
          fillOpacity: 1,
          strokeWidth: 0.2,
          strokeLinejoin: "round",
          d: "M 50.6667,25.3333L 50.6667,41.1667L 41.1667,41.1667L 41.1667,50.6667L 25.3333,50.6667L 25.3333,34.8333L 34.8333,34.8333L 34.8333,25.3333L 50.6667,25.3333 Z M 14.25,14.25L 16.6251,14.25L 14.25,16.6251L 14.25,14.25 Z M 24.542,14.2501L 14.25,24.5421L 14.25,18.2083L 18.2082,14.25L 24.542,14.2501 Z M 15.0415,33.2503L 33.25,15.0419L 33.2499,21.3759L 21.3751,33.2503L 15.0415,33.2503 Z M 14.25,26.1254L 26.1251,14.25L 32.4586,14.25L 14.25,32.4587L 14.25,26.1254 Z M 22.9584,33.2503L 33.25,22.9585L 33.25,29.2918L 29.2922,33.2503L 22.9584,33.2503 Z M 61.75,61.75L 59.3749,61.75L 61.75,59.3749L 61.75,61.75 Z M 51.458,61.75L 61.75,51.458L 61.75,57.7918L 57.7918,61.75L 51.458,61.75 Z M 60.9584,42.7497L 42.75,60.9581L 42.75,54.6241L 54.6249,42.7497L 60.9584,42.7497 Z M 61.75,49.8746L 49.8749,61.75L 43.5414,61.75L 61.75,43.5413L 61.75,49.8746 Z M 53.0415,42.7497L 42.75,53.0415L 42.75,46.7082L 46.7078,42.7497L 53.0415,42.7497 Z ",
        })
      )
    ),
  On = () => {
    const { t } = _();
    return w(U, {
      children: [
        c("div", {
          className: "font-bold font-fredokaOne mt-3 text-sm",
          children: t("title.layer"),
        }),
        w("ul", {
          className:
            "menu menu-vertical lg:menu-horizontal bg-base-100 rounded-box mt-1 flex-row w-max",
          children: [
            c("li", {
              children: c("a", {
                className: "px-1.5 py-1",
                onClick: () => l.bringForWard(),
                children: c(Pn, {}),
              }),
            }),
            c("li", {
              children: c("a", {
                className: "px-1.5 py-1",
                onClick: () => l.seendBackWard(),
                children: c(Rn, {}),
              }),
            }),
            c("li", {
              children: c("a", {
                className: "px-1.5 py-1",
                onClick: () => l.bringToFront(),
                children: c(Nn, {}),
              }),
            }),
            c("li", {
              children: c("a", {
                className: "px-1.5 py-1",
                onClick: () => l.sendToBack(),
                children: c(An, {}),
              }),
            }),
          ],
        }),
      ],
    });
  },
  _n = ({ refreshCount: t }) => {
    const { t: e } = _(),
      r = o.exports.useMemo(() => {
        var h;
        let s = !1,
          i = 1;
        const d = (h = l.canvas) == null ? void 0 : h.getActiveObjects();
        if (d != null && d.length) {
          s = !0;
          const g =
            d == null
              ? void 0
              : d.map((m) => {
                  var C;
                  return (C = m.opacity) != null ? C : 1;
                });
          g.length && (i = Math.max(...g));
        }
        return { show: s, opacity: i };
      }, [t]),
      a = o.exports.useCallback(
        ne.exports.debounce(() => {
          var s;
          (s = l.history) == null || s.saveState();
        }, 500),
        []
      ),
      n = (s) => {
        var d, h, g;
        const i = (d = l.canvas) == null ? void 0 : d.getActiveObjects();
        i != null &&
          i.length &&
          (i == null ||
            i.forEach((m) => {
              m.opacity = s;
            }),
          (h = l.canvas) == null || h.fire("selection:updated"),
          (g = l.canvas) == null || g.renderAll(),
          a());
      };
    return c(U, {
      children:
        r.show &&
        w(U, {
          children: [
            c("div", {
              className: "font-bold font-fredokaOne mt-3 text-sm",
              children: e("title.opacity"),
            }),
            c("div", {
              className: "mt-1 flex items-center w-full",
              children: c("input", {
                className: "range range-primary range-xs",
                type: "range",
                min: "0",
                max: "1",
                step: "0.01",
                value: r.opacity,
                onChange: (s) => n(Number(s.target.value)),
              }),
            }),
          ],
        }),
    });
  },
  Bn = ({ refreshCount: t }) => {
    const { t: e } = _(),
      r = o.exports.useMemo(() => {
        var d;
        let n = !1,
          s = !0;
        const i = (d = l.canvas) == null ? void 0 : d.getActiveObjects();
        return (
          i != null &&
            i.length &&
            ((n = !0),
            (s = !(
              i != null &&
              i.every((h) => (h == null ? void 0 : h.erasable) === !1)
            ))),
          { show: n, erasable: s }
        );
      }, [t]),
      a = () => {
        var s, i;
        const n = (s = l.canvas) == null ? void 0 : s.getActiveObjects();
        n != null &&
          n.length &&
          (n == null ||
            n.forEach((d) => {
              d.erasable = !r.erasable;
            }),
          (i = l.canvas) == null || i.fire("selection:updated"),
          l.render());
      };
    return c(U, {
      children:
        r.show &&
        w(U, {
          children: [
            c("div", {
              className: "font-bold font-fredokaOne mt-3 text-sm",
              children: e("eraserConfig.eraser"),
            }),
            w("div", {
              className: "mt-1 flex items-center w-full",
              children: [
                c("div", {
                  className: "font-fredokaOne text-xs mr-3",
                  children: e("eraserConfig.erasable"),
                }),
                c("input", {
                  type: "checkbox",
                  className: "toggle toggle-success",
                  checked: r.erasable,
                  onChange: a,
                }),
              ],
            }),
          ],
        }),
    });
  },
  Fn = [
    { type: "Sepia", text: "filters.Sepia" },
    { type: "Invert", text: "filters.Invert" },
    { type: "BlackWhite", text: "filters.BlackWhite" },
    { type: "Grayscale", text: "filters.Grayscale" },
    { type: "Blur", text: "filters.Blur" },
    { type: "Vintage", text: "filters.Vintage" },
    { type: "BlendColor", text: "filters.BlendColor" },
    { type: "Brownie", text: "filters.Brownie" },
    { type: "Kodachrome", text: "filters.Kodachrome" },
    { type: "Pixelate", text: "filters.Pixelate" },
    { type: "Polaroid", text: "filters.Polaroid" },
    { type: "Technicolor", text: "filters.Technicolor" },
    { type: "Brightness", text: "filters.Brightness" },
    { type: "Noise", text: "filters.Noise" },
    { type: "Convolute", text: "filters.Convolute" },
  ],
  Dn = () => {
    const { t } = _(),
      e = (r) => {
        var n;
        const a = (n = l.canvas) == null ? void 0 : n.getActiveObject();
        ya(a, r), l.render(), l.triggerHook();
      };
    return w(U, {
      children: [
        c("div", {
          className: "font-bold font-fredokaOne mt-3 text-sm",
          children: t("title.imageFilters"),
        }),
        c("div", {
          className:
            "flex flex-row flex-wrap w-72 items-center justify-between",
          children: Fn.map((r, a) => {
            var n, s, i, d;
            return w(
              "label",
              {
                className: "cursor-pointer label inline-flex w-32",
                children: [
                  c("span", {
                    className: "label-text mr-2",
                    children: t(r.text),
                  }),
                  c("input", {
                    type: "checkbox",
                    checked: ((d =
                      (i =
                        (s =
                          (n = l.canvas) == null
                            ? void 0
                            : n.getActiveObject()) == null
                          ? void 0
                          : s.filters) == null
                        ? void 0
                        : i.map((h) => {
                            var g;
                            return (g = h == null ? void 0 : h.type) != null
                              ? g
                              : "";
                          })) != null
                      ? d
                      : []
                    ).includes(r.type),
                    onChange: () => e(r.type),
                    className: "checkbox checkbox-success",
                  }),
                ],
              },
              a
            );
          }),
        }),
      ],
    });
  },
  Wn = [
    { type: re.BOLD, text: "fontStyle.bold" },
    { type: re.ITALIC, text: "fontStyle.italic" },
    { type: re.UNDER_LINE, text: "fontStyle.underLine" },
    { type: re.LINE_THROUGH, text: "fontStyle.lineThrough" },
  ],
  Hn = ({ refreshCount: t }) => {
    const { t: e } = _(),
      { updateFontStyles: r } = f(),
      a = o.exports.useMemo(() => {
        var d;
        const s = (d = l.canvas) == null ? void 0 : d.getActiveObject(),
          i = [];
        return (
          s.fontWeight === "bold" && i.push(re.BOLD),
          s.fontStyle === "italic" && i.push(re.ITALIC),
          s.underline && i.push(re.UNDER_LINE),
          s.linethrough && i.push(re.LINE_THROUGH),
          i
        );
      }, [t]),
      n = (s) => {
        var d;
        r(s);
        const i = (d = l.canvas) == null ? void 0 : d.getActiveObject();
        switch (s) {
          case re.BOLD:
            i.set({ fontWeight: i.fontWeight === "bold" ? "normal" : "bold" });
            break;
          case re.ITALIC:
            i.set({
              fontStyle: i.fontStyle === "italic" ? "normal" : "italic",
            });
            break;
          case re.UNDER_LINE:
            i.set({ underline: !i.underline });
            break;
          case re.LINE_THROUGH:
            i.set({ linethrough: !i.linethrough });
            break;
        }
        l.render(), l.triggerHook();
      };
    return w(U, {
      children: [
        c("div", {
          className: "font-bold font-fredokaOne mt-3 text-sm",
          children: e("title.fontStyle"),
        }),
        c("div", {
          className: "flex flex-row flex-wrap items-center w-56 mt-2",
          children: Wn.map((s, i) =>
            w(
              "label",
              {
                className:
                  "cursor-pointer label inline-flex justify-start w-28 px-0 py-1",
                children: [
                  c("span", {
                    className: "label-text mr-2 font-fredokaOne text-xs",
                    children: e(s.text),
                  }),
                  c("input", {
                    type: "checkbox",
                    checked: a == null ? void 0 : a.includes(s.type),
                    onChange: () => n(s.type),
                    className: "checkbox checkbox-success checkbox-sm",
                  }),
                ],
              },
              i
            )
          ),
        }),
      ],
    });
  },
  Gn = ({ refreshCount: t }) => {
    var b, y;
    const { fillColor: e } = W(),
      r = (v) => {
        if (Array.isArray(v)) {
          const [x, S] = v;
          return x > S ? ae.Dashed : ae.Dotted;
        } else return v ? "" : ae.Solid;
      },
      a = o.exports.useMemo(() => {
        var x, S;
        const v =
          (S = (x = l.canvas) == null ? void 0 : x.getActiveObject()) == null
            ? void 0
            : S.strokeDashArray;
        return r(v);
      }, [t]),
      n = (v) => {
        var I, T, E, M;
        const x =
          (T = (I = l.canvas) == null ? void 0 : I.getActiveObject()) == null
            ? void 0
            : T.strokeWidth;
        if (!x) return;
        let S;
        switch (v) {
          case ae.Dashed:
            S = [x * 3, x * 2];
            break;
          case ae.Dotted:
            S = [x, x * 3];
            break;
        }
        (M = (E = l.canvas) == null ? void 0 : E.getActiveObject()) == null ||
          M.set({ strokeDashArray: S }),
          l.render(),
          l.triggerHook();
      },
      s = o.exports.useMemo(() => {
        var v, x, S;
        return (S =
          (x = (v = l.canvas) == null ? void 0 : v.getActiveObject()) == null
            ? void 0
            : x.stroke) != null
          ? S
          : void 0;
      }, [t]),
      i = o.exports.useCallback(
        ne.exports.debounce((v) => {
          var x, S;
          (S = (x = l.canvas) == null ? void 0 : x.getActiveObject()) == null ||
            S.set({ stroke: v }),
            l.render(),
            l.triggerHook();
        }, 500),
        []
      ),
      d = o.exports.useMemo(() => {
        var v, x, S;
        return (S =
          (x = (v = l.canvas) == null ? void 0 : v.getActiveObject()) == null
            ? void 0
            : x.strokeWidth) != null
          ? S
          : void 0;
      }, [t]),
      h = o.exports.useCallback(
        ne.exports.debounce((v) => {
          var T, E, M, j;
          const x =
              (E = (T = l.canvas) == null ? void 0 : T.getActiveObject()) ==
              null
                ? void 0
                : E.strokeDashArray,
            S = r(x);
          let I;
          switch (S) {
            case ae.Dashed:
              I = [v * 3, v * 2];
              break;
            case ae.Dotted:
              I = [v, v * 3];
              break;
          }
          (j = (M = l.canvas) == null ? void 0 : M.getActiveObject()) == null ||
            j.set({ strokeWidth: v, strokeDashArray: I }),
            l.render(),
            l.triggerHook();
        }, 500),
        []
      ),
      g = o.exports.useMemo(() => {
        var v, x;
        return (x = (v = l.canvas) == null ? void 0 : v.getActiveObject()) ==
          null
          ? void 0
          : x.fill;
      }, [t]),
      m = o.exports.useCallback(
        ne.exports.debounce((v) => {
          var S, I, T, E;
          ((I = (S = l.canvas) == null ? void 0 : S.getActiveObject()) == null
            ? void 0
            : I.fill) !== "transparent" &&
            ((E = (T = l.canvas) == null ? void 0 : T.getActiveObject()) ==
              null || E.set({ fill: v }),
            l.render(),
            l.triggerHook());
        }, 500),
        []
      ),
      C = o.exports.useMemo(() => {
        var x, S;
        return ((S = (x = l.canvas) == null ? void 0 : x.getActiveObject()) ==
        null
          ? void 0
          : S.fill) === "transparent"
          ? ue.Transparent
          : ue.Full;
      }, [t]),
      L = (v) => {
        var x, S, I, T;
        switch (v) {
          case ue.Transparent:
            (S = (x = l.canvas) == null ? void 0 : x.getActiveObject()) ==
              null || S.set({ fill: "transparent" });
            break;
          case ue.Full:
            (T = (I = l.canvas) == null ? void 0 : I.getActiveObject()) ==
              null || T.set({ fill: e });
            break;
        }
        l.render(), l.triggerHook();
      };
    return w(U, {
      children: [
        c(Nt, { borderType: a, updateBorderType: n }),
        c(Rt, {
          borderColor: s,
          updateBorderColor: i,
          borderWidth: d,
          updateBorderWidth: h,
        }),
        Object.values(
          ne.exports.omit(Ye, ["SHAPE_LINE", "SHAPE_ARROW_LINE"])
        ).includes(
          (y = (b = l.canvas) == null ? void 0 : b.getActiveObject()) == null
            ? void 0
            : y._customType
        ) &&
          c(At, {
            fillColor: g,
            fillType: C,
            updateFillColor: m,
            updateFillType: L,
          }),
      ],
    });
  },
  Xn = ({ refreshCount: t }) => {
    const e = (a) => {
        var s;
        const n = (s = l.canvas) == null ? void 0 : s.getActiveObject();
        (n == null ? void 0 : n._customType) === A.I_TEXT
          ? n.set("fontFamily", a)
          : (n == null ? void 0 : n._customType) === A.DRAW_TEXT &&
            n._objects.forEach((i) => {
              i.set("fontFamily", a);
            }),
          l.render(),
          l.triggerHook();
      },
      r = o.exports.useMemo(() => {
        var n, s, i;
        const a = (n = l.canvas) == null ? void 0 : n.getActiveObject();
        return (a == null ? void 0 : a._customType) === A.I_TEXT
          ? (a == null ? void 0 : a.fontFamily) || ""
          : ((a == null ? void 0 : a._customType) === A.DRAW_TEXT &&
              ((i = (s = a._objects) == null ? void 0 : s[0]) == null
                ? void 0
                : i.fontFamily)) ||
              "";
      }, [t]);
    return c(Tt, { fontFamily: r, updateFontFamily: e });
  },
  Vn = () => {
    var r, a, n, s, i, d, h, g, m;
    const [t, e] = o.exports.useState(0);
    return (
      o.exports.useEffect(() => {
        const C = () => e((L) => L + 1);
        return (
          l.addHookFn(C),
          () => {
            l.removeHookFn(C);
          }
        );
      }, [e]),
      w("div", {
        className: "form-control",
        children: [
          c(_n, { refreshCount: t }),
          c(Bn, { refreshCount: t }),
          ((r = l.canvas) == null ? void 0 : r.getActiveObject()) && c(On, {}),
          ((n = (a = l.canvas) == null ? void 0 : a.getActiveObject()) == null
            ? void 0
            : n._customType) === A.IMAGE && c(Dn, {}),
          ((i = (s = l.canvas) == null ? void 0 : s.getActiveObject()) == null
            ? void 0
            : i._customType) === A.I_TEXT && c(Hn, { refreshCount: t }),
          [A.DRAW_TEXT, A.I_TEXT].includes(
            (h = (d = l.canvas) == null ? void 0 : d.getActiveObject()) == null
              ? void 0
              : h._customType
          ) && c(Xn, { refreshCount: t }),
          Object.values(Ye).includes(
            (m = (g = l.canvas) == null ? void 0 : g.getActiveObject()) == null
              ? void 0
              : m._customType
          ) && c(Gn, { refreshCount: t }),
        ],
      })
    );
  },
  ut = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1702136520403,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 1624,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 36,
        height: 36,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M0 0h192v192H0z",
        "p-id": 1625,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M192 192h192v192H192z",
        opacity: 0.6,
        "p-id": 1626,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M384 0h192v192H384z",
        opacity: 0.8,
        "p-id": 1627,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M576 192h192v192H576z",
        opacity: 0.4,
        "p-id": 1628,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M768 0h192v192h-192z",
        opacity: 0.6,
        "p-id": 1629,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M0 384h192v192H0z",
        opacity: 0.8,
        "p-id": 1630,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M192 576h192v192H192zM384 384h192v192H384z",
        opacity: 0.4,
        "p-id": 1631,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M576 576h192v192H576zM768 384h192v192h-192z",
        opacity: 0.2,
        "p-id": 1632,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M0 768h192v192H0z",
        opacity: 0.4,
        "p-id": 1633,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M384 768h192v192H384z",
        opacity: 0.2,
        "p-id": 1634,
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M768 768h192v192h-192z",
        opacity: 0.1,
        "p-id": 1635,
        fill: "#65CC8A",
      })
    ),
  Ot = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "28px",
        height: "28px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M13 4H8.8C7.11984 4 6.27976 4 5.63803 4.32698C5.07354 4.6146 4.6146 5.07354 4.32698 5.63803C4 6.27976 4 7.11984 4 8.8V15.2C4 16.8802 4 17.7202 4.32698 18.362C4.6146 18.9265 5.07354 19.3854 5.63803 19.673C6.27976 20 7.11984 20 8.8 20H15.2C16.8802 20 17.7202 20 18.362 19.673C18.9265 19.3854 19.3854 18.9265 19.673 18.362C20 17.7202 20 16.8802 20 15.2V11",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M4 16L8.29289 11.7071C8.68342 11.3166 9.31658 11.3166 9.70711 11.7071L13 15M13 15L15.7929 12.2071C16.1834 11.8166 16.8166 11.8166 17.2071 12.2071L20 15M13 15L15.25 17.25",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M18 8V3M18 3L16 5M18 3L20 5",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  Yn = (t) =>
    o.exports.createElement(
      "svg",
      {
        id: "Layer_1",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        viewBox: "0 0 512 512",
        xmlSpace: "preserve",
        width: "64px",
        height: "64px",
        fill: "#000000",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("polygon", {
          style: { fill: "#00954A" },
          points:
            "504.082,303.505 504.082,414.351 324.091,304.35 324.619,303.505 398.515,234.887 ",
        }),
        o.exports.createElement("polygon", {
          style: { fill: "#0EB14C" },
          points:
            "504.082,414.351 504.082,451.299 7.918,451.299 7.918,377.402 219.052,240.165 324.091,304.35 ",
        }),
        o.exports.createElement("polygon", {
          style: { fill: "#0071BC" },
          points:
            "504.082,60.701 504.082,303.505 398.515,234.887 324.619,303.505 324.091,304.35 219.052,240.165 7.918,377.402 7.918,60.701 ",
        }),
        o.exports.createElement("polygon", {
          style: { fill: "#008647" },
          points:
            "504.082,371.515 355.794,274.557 324.619,303.505 324.091,304.35 504.082,414.351 ",
        }),
        o.exports.createElement("polygon", {
          style: { fill: "#00AB4F" },
          points:
            "504.082,451.299 504.082,414.351 324.091,304.35 219.052,240.165 180.422,265.274 496.315,451.299 ",
        }),
        o.exports.createElement("polygon", {
          style: { fill: "#0089CC" },
          points:
            "7.918,60.701 7.918,377.402 219.052,240.165 256,262.743 256,60.701 ",
        }),
        o.exports.createElement("path", {
          style: { fill: "#FFD311" },
          d: "M306.144,102.928c30.614,0,55.423,24.808,55.423,55.423s-24.808,55.423-55.423,55.423 s-55.423-24.808-55.423-55.423S275.53,102.928,306.144,102.928z",
        }),
        o.exports.createElement("path", {
          style: { fill: "#FABB1B" },
          d: "M277.166,111.299c-15.814,9.76-26.445,27.099-26.445,47.051c0,30.614,24.808,55.423,55.423,55.423 c14.673,0,27.919-5.805,37.833-15.11C311.607,179.552,287.312,148.41,277.166,111.299z",
        }),
        o.exports.createElement("path", {
          style: { fill: "#F1F2F2" },
          d: "M155.711,139.876c14.568,0,26.392,11.824,26.392,26.392s-11.824,26.392-26.392,26.392 s-55.845,0-68.619,0c-14.568,0-26.392-11.824-26.392-26.392s11.824-26.392,26.392-26.392c0.211,0,0.317,0,0.528,0.106 c2.428-12.14,13.09-21.219,25.864-21.219c14.568,0,26.392,11.823,26.392,26.392v0.106 C144.31,141.988,149.694,139.876,155.711,139.876z",
        }),
        o.exports.createElement("path", {
          d: "M0,52.784v406.433h512V52.784H0z M496.165,68.619v220.297l-98.512-64.033l-74.788,69.445l-103.944-63.522L15.835,362.813 V68.619H496.165z M496.165,400.233L336.9,302.905l62.477-58.015l96.788,62.913V400.233z M15.835,443.381v-61.683l203.346-132.175 l100.78,61.581l176.204,107.686v24.591H15.835z",
        }),
        o.exports.createElement("path", {
          d: "M306.144,221.691c34.926,0,63.34-28.414,63.34-63.34s-28.414-63.34-63.34-63.34s-63.34,28.414-63.34,63.34 S271.219,221.691,306.144,221.691z M306.144,110.845c26.194,0,47.505,21.311,47.505,47.505s-21.311,47.505-47.505,47.505 s-47.505-21.311-47.505-47.505S279.95,110.845,306.144,110.845z",
        }),
        o.exports.createElement("path", {
          d: "M87.093,200.577h68.619c18.918,0,34.309-15.392,34.309-34.309s-15.392-34.309-34.309-34.309 c-3.388,0-6.733,0.517-9.961,1.525c-4.785-13.191-17.443-22.639-32.265-22.639c-14.154,0-26.688,8.76-31.827,21.543 c-16.344,2.614-28.874,16.81-28.874,33.88C52.784,185.186,68.175,200.577,87.093,200.577z M85.654,147.851l7.698,3.849l2.033-10.165 c1.721-8.607,9.333-14.854,18.099-14.854c10.186,0,18.474,8.288,18.474,18.474v15.791l12.619-9.314 c3.45-2.546,7.195-3.836,11.133-3.836c10.186,0,18.474,8.288,18.474,18.474c0,10.186-8.288,18.474-18.474,18.474H87.093 c-10.186,0-18.474-8.288-18.474-18.474C68.619,156.572,76.126,148.596,85.654,147.851z",
        }),
        o.exports.createElement(
          "g",
          null,
          o.exports.createElement("rect", {
            x: 204.892,
            y: 329.91,
            transform:
              "matrix(-0.8526 -0.5226 0.5226 -0.8526 380.8123 783.0786)",
            style: { fill: "#FFFFFF" },
            width: 191.924,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 374.107,
            y: 314.087,
            transform:
              "matrix(-0.8396 -0.5433 0.5433 -0.8396 611.5624 824.6218)",
            style: { fill: "#FFFFFF" },
            width: 106.882,
            height: 15.836,
          }),
          o.exports.createElement("rect", {
            x: 414.351,
            y: 100.289,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 440.742,
            y: 137.237,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 39.588,
            y: 95.01,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 197.938,
            y: 105.567,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 39.588,
            y: 274.474,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 92.371,
            y: 232.247,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          }),
          o.exports.createElement("rect", {
            x: 387.959,
            y: 168.907,
            style: { fill: "#FFFFFF" },
            width: 36.948,
            height: 15.835,
          })
        )
      )
    ),
  zn = () => {
    const {
        backgroundColor: t,
        backgroundOpacity: e,
        hasBackgroundImage: r,
        backgroundImageOpacity: a,
        updateBackgroundColor: n,
        updateBackgroundOpacity: s,
        updateBackgroundImage: i,
        updateBackgroundImageOpacity: d,
        cleanBackgroundImage: h,
        initBackground: g,
      } = O(),
      { t: m } = _(),
      C = o.exports.useCallback(
        ne.exports.debounce(() => {
          l.render();
        }, 500),
        []
      );
    o.exports.useEffect(
      () => (
        l.addHookFn(g),
        () => {
          l.removeHookFn(g);
        }
      ),
      [g]
    );
    const L = (y) => {
        var S;
        const v = (S = y.target.files) == null ? void 0 : S[0];
        if (!v) return;
        const x = new FileReader();
        (x.onload = (I) => {
          var E;
          const T = (E = I.target) == null ? void 0 : E.result;
          T && T && typeof T == "string" && i(T), (y.target.value = "");
        }),
          x.readAsDataURL(v);
      },
      b = (y) => {
        y.preventDefault(), y.stopPropagation(), h();
      };
    return w("div", {
      className: "form-control mt-3",
      children: [
        c("div", {
          className: "font-bold font-fredokaOne text-sm",
          children: m("title.canvasBackground"),
        }),
        w("div", {
          className: "mt-1 flex items-center w-full",
          children: [
            c("div", {
              className: "w-7 h-7",
              children: c("input", {
                type: "color",
                value: cr(t || ""),
                onChange: (y) => {
                  n(y.target.value), C();
                },
                className: "colorInput",
              }),
            }),
            c("div", { className: "divider divider-horizontal mx-3" }),
            c(ut, { className: "mr-2" }),
            c("input", {
              className: "range range-primary range-xs",
              type: "range",
              min: "0",
              max: "1",
              step: "0.01",
              value: String(e),
              onChange: (y) => {
                s(Number(y.target.value)), C();
              },
            }),
          ],
        }),
        w("div", {
          className: "mt-3 flex items-center w-full",
          children: [
            c("label", {
              htmlFor: "background-image-upload",
              className:
                "shrink-0 cursor-pointer rounded relative hover:bg-slate-200",
              children: r
                ? w(U, {
                    children: [
                      c(Pt, {
                        onClick: b,
                        className:
                          "absolute top-[-6px] right-[-6px] rounded-full w-3 h-3 cursor-pointer",
                      }),
                      c(Yn, { className: "w-7 h-7 object-contain" }),
                    ],
                  })
                : c(Ot, {}),
            }),
            c("input", {
              type: "file",
              id: "background-image-upload",
              accept: ".jpeg, .jpg, .png",
              className: "hidden",
              onChange: L,
            }),
            c("div", { className: "divider divider-horizontal mx-3" }),
            c(ut, { className: "mr-2" }),
            c("input", {
              className: "range range-primary range-xs",
              type: "range",
              min: "0",
              max: "1",
              step: "0.01",
              value: String(a),
              onChange: (y) => {
                d(Number(y.target.value)), C();
              },
            }),
          ],
        }),
      ],
    });
  },
  jn = () => {
    const {
        canvasWidth: t,
        canvasHeight: e,
        updateCanvasWidth: r,
        updateCanvasHeight: a,
      } = O(),
      { t: n } = _();
    return w("div", {
      className: "form-control mt-3",
      children: [
        c("div", {
          className: "font-bold font-fredokaOne text-sm",
          children: n("title.canvasSize"),
        }),
        w("div", {
          className: "mt-1 flex items-center w-full",
          children: [
            c("div", {
              className: "text-sm font-fredokaOne w-12 mr-2 shrink-0",
              children: n("canvasSize.width"),
            }),
            c("div", {
              className:
                "text-sm font-fredokaOne mr-2 text-primary-focus w-9 shrink-0",
              children: (t * 100).toFixed(0) + "%",
            }),
            c("input", {
              className: "range range-primary range-xs",
              type: "range",
              min: "0.1",
              max: "1",
              step: "0.01",
              value: String(t),
              onChange: (s) => {
                r(Number(s.target.value));
              },
            }),
          ],
        }),
        w("div", {
          className: "mt-1 flex items-center w-full",
          children: [
            c("div", {
              className: "text-sm font-fredokaOne w-12 mr-2 shrink-0",
              children: n("canvasSize.height"),
            }),
            c("div", {
              className:
                "text-sm font-fredokaOne mr-2 text-primary-focus w-9 shrink-0",
              children: (e * 100).toFixed(0) + "%",
            }),
            c("input", {
              className: "range range-primary range-xs",
              type: "range",
              min: "0.1",
              max: "1",
              step: "0.01",
              value: String(e),
              onChange: (s) => {
                a(Number(s.target.value));
              },
            }),
          ],
        }),
      ],
    });
  },
  Un = () => {
    const { t } = _(),
      { isObjectCaching: e, updateCacheState: r } = O();
    return w("div", {
      className: "form-control mt-3",
      children: [
        c("div", {
          className: "font-bold font-fredokaOne text-sm",
          children: t("title.drawCache"),
        }),
        w("div", {
          className: "mt-1 flex items-start w-full",
          children: [
            c("input", {
              type: "checkbox",
              className: "toggle toggle-success",
              checked: e,
              onChange: r,
            }),
            c("div", {
              className: "text-xs w-40 ml-3",
              children: t("boardConfig.cacheTip"),
            }),
          ],
        }),
      ],
    });
  },
  $n = () => {
    const { openGuideLine: t, updateOpenGuideLine: e } = O(),
      { t: r } = _();
    return w("div", {
      className: "form-control mt-3",
      children: [
        c("div", {
          className: "font-bold font-fredokaOne text-sm",
          children: r("title.guideLine"),
        }),
        c("div", {
          className: "mt-1 flex items-start w-full",
          children: c("input", {
            type: "checkbox",
            className: "toggle toggle-success",
            checked: t,
            onChange: e,
          }),
        }),
      ],
    });
  },
  Zn = () => w(U, { children: [c(zn, {}), c(jn, {}), c(Un, {}), c($n, {})] }),
  _t = (t) =>
    o.exports.createElement(
      "svg",
      {
        className: "{className} ",
        xmlns: "http://www.w3.org/2000/svg",
        width: 24,
        height: 24,
        viewBox: "0 0 512 512",
        ...t,
      },
      o.exports.createElement("path", {
        d: "M64,384H448V341.33H64Zm0-106.67H448V234.67H64ZM64,128v42.67H448V128Z",
      })
    ),
  Bt = (t) =>
    o.exports.createElement(
      "svg",
      {
        className: "{className} ",
        xmlns: "http://www.w3.org/2000/svg",
        width: 24,
        height: 24,
        viewBox: "0 0 512 512",
        ...t,
      },
      o.exports.createElement("polygon", {
        points:
          "400 145.49 366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49",
      })
    ),
  qn = () => {
    const { t } = _(),
      { mode: e, updateMode: r } = O(),
      [a, n] = o.exports.useState(!0);
    return w("div", {
      className: `fixed top-7 left-7 flex flex-col card shadow-xl overflow-visible z-3 bg-[#eef1ff] max-h-[80%] max-w-[85%] ${
        a ? "p-5" : ""
      }`,
      children: [
        w("label", {
          className:
            "btn btn-circle swap swap-rotate absolute -top-3 -left-3 h-7 w-7 min-h-0",
          children: [
            c("input", { type: "checkbox", onChange: () => n((s) => !s) }),
            c(_t, { className: "swap-on fill-current" }),
            c(Bt, { className: "swap-off fill-current" }),
          ],
        }),
        a &&
          w("div", {
            className: "max-h-[100%] overflow-y-auto noScrollbar",
            children: [
              c("div", {
                className: "tabs tabs-boxed bg-[#333C4D]",
                children: Ta.map(({ type: s, text: i }) =>
                  c(
                    "a",
                    {
                      className: `tab tab-sm flex-grow font-fredokaOne text-white font-medium ${
                        e === s ? "tab-active" : ""
                      }`,
                      onClick: () => {
                        r(s);
                      },
                      children: t(i),
                    },
                    s
                  )
                ),
              }),
              e === z.DRAW && c(In, {}),
              e === z.ERASE && c(Tn, {}),
              e === z.SELECT && c(Vn, {}),
              e === z.Board && c(Zn, {}),
            ],
          }),
      ],
    });
  },
  Kn = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "#65CC8A",
        width: "28px",
        height: "28px",
        viewBox: "0 0 32 32",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("title", null, "info1"),
        o.exports.createElement("path", {
          d: "M16 3c-7.18 0-13 5.82-13 13s5.82 13 13 13 13-5.82 13-13-5.82-13-13-13zM18.039 20.783c-0.981 1.473-1.979 2.608-3.658 2.608-1.146-0.187-1.617-1.008-1.369-1.845l2.16-7.154c0.053-0.175-0.035-0.362-0.195-0.419-0.159-0.056-0.471 0.151-0.741 0.447l-1.306 1.571c-0.035-0.264-0.004-0.7-0.004-0.876 0.981-1.473 2.593-2.635 3.686-2.635 1.039 0.106 1.531 0.937 1.35 1.85l-2.175 7.189c-0.029 0.162 0.057 0.327 0.204 0.379 0.16 0.056 0.496-0.151 0.767-0.447l1.305-1.57c0.035 0.264-0.024 0.726-0.024 0.902zM17.748 11.439c-0.826 0-1.496-0.602-1.496-1.488s0.67-1.487 1.496-1.487 1.496 0.602 1.496 1.487c0 0.887-0.67 1.488-1.496 1.488z",
        })
      )
    ),
  Jn = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "64px",
        height: "64px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M8.93 2H5.02C3 2 2 3 2 5.02V8.94C2 11 3 12 5.02 11.95H8.94C11 12 12 11 11.95 8.93V5.02C12 3 11 2 8.93 2ZM9.01 9.76C8.33 9.76 7.67 9.5 7.12 9.04C6.5 9.49 5.75 9.76 4.94 9.76C4.53 9.76 4.19 9.42 4.19 9.01C4.19 8.6 4.53 8.26 4.94 8.26C5.96 8.26 6.81 7.56 7.12 6.6H4.94C4.53 6.6 4.19 6.26 4.19 5.85C4.19 5.44 4.53 5.1 4.94 5.1H6.23C6.27 4.72 6.58 4.42 6.97 4.42C7.36 4.42 7.67 4.72 7.71 5.1H7.97C7.98 5.1 7.99 5.1 7.99 5.1H8.01H9C9.41 5.1 9.75 5.44 9.75 5.85C9.75 6.26 9.42 6.6 9 6.6H8.67C8.58 7.08 8.39 7.53 8.14 7.94C8.41 8.14 8.7 8.26 9.01 8.26C9.42 8.26 9.76 8.6 9.76 9.01C9.76 9.42 9.42 9.76 9.01 9.76Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          d: "M9 22.75C4.73 22.75 1.25 19.27 1.25 15C1.25 14.59 1.59 14.25 2 14.25C2.41 14.25 2.75 14.59 2.75 15C2.75 17.96 4.81 20.44 7.58 21.09L7.31 20.64C7.1 20.28 7.21 19.82 7.57 19.61C7.92 19.4 8.39 19.51 8.6 19.87L9.65 21.62C9.79 21.85 9.79 22.14 9.66 22.37C9.52 22.6 9.27 22.75 9 22.75Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          d: "M21.9985 9.75C21.5885 9.75 21.2485 9.41 21.2485 9C21.2485 6.04 19.1885 3.56 16.4185 2.91L16.6885 3.36C16.8985 3.72 16.7885 4.18 16.4285 4.39C16.0785 4.6 15.6085 4.49 15.3985 4.13L14.3485 2.38C14.2085 2.15 14.2085 1.86 14.3385 1.63C14.4785 1.4 14.7285 1.25 14.9985 1.25C19.2685 1.25 22.7485 4.73 22.7485 9C22.7485 9.41 22.4085 9.75 21.9985 9.75Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          d: "M16.9198 11.8516C14.1198 11.8516 11.8398 14.1216 11.8398 16.9316C11.8398 19.7316 14.1098 22.0116 16.9198 22.0116C19.7198 22.0116 21.9998 19.7416 21.9998 16.9316C21.9998 14.1216 19.7298 11.8516 16.9198 11.8516ZM19.3998 19.3416C19.0298 19.5216 18.5798 19.3816 18.3898 19.0016L18.2198 18.6616H15.6298L15.4598 19.0016C15.3298 19.2616 15.0598 19.4116 14.7898 19.4116C14.6798 19.4116 14.5598 19.3816 14.4598 19.3316C14.0898 19.1416 13.9398 18.6916 14.1198 18.3216L16.2598 14.0516C16.3898 13.8016 16.6498 13.6416 16.9298 13.6416C17.2098 13.6416 17.4698 13.8016 17.5998 14.0616L19.7398 18.3316C19.9198 18.7016 19.7698 19.1516 19.3998 19.3416Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          d: "M16.3789 17.1603H17.4689L16.9189 16.0703L16.3789 17.1603Z",
          fill: "#000000",
        })
      )
    ),
  Qn = () => {
    var r;
    const [t, e] = o.exports.useState(
      (r = l.evnet) == null ? void 0 : r.zoomEvent.handleZoomPercentage(!1)
    );
    return (
      o.exports.useEffect(() => {
        var a;
        (a = l.evnet) == null ||
          a.zoomEvent.setZoomHook((n) => {
            e(n);
          });
      }, [e]),
      c("div", {
        className:
          "radial-progress bg-primary text-primary-content border-4 border-primary cursor-pointer ml-2",
        style: { "--value": t, "--size": "1.1rem", "--thickness": "0.2rem" },
        onClick: () => {
          var a;
          return (a = l.evnet) == null ? void 0 : a.zoomEvent.initZoom();
        },
      })
    );
  },
  Be = ({ show: t, clickMask: e, children: r }) =>
    c("div", {
      className: `fixed top-0 left-0 right-0 bottom-0 bg-black z-10 bg-opacity-75 ${
        t ? "block" : "hidden"
      }`,
      onClick: e,
      children: c("div", {
        className:
          "absolute top-1/2 left-1/2 -translate-x-2/4 -translate-y-2/4",
        onClick: (a) => a.stopPropagation(),
        children: r,
      }),
    });
const es = [
    {
      imageList: [
        "remote_files/drawMode_freeStyle_1.3.0.png",
      ],
      title: "自由绘制",
      textList: ["line1", "line2", "line3", "line4", "line5"],
    },
    {
      imageList: [
        "remote_files/drawMode_shape_1.3.0.png",
      ],
      title: "形状绘制",
      textList: ["line1"],
    },
    {
      imageList: [
        "remote_files/eraserMode_1.3.0.png",
      ],
      title: "橡皮擦",
      textList: ["line1", "line2"],
    },
    {
      imageList: [
        "remote_files/selectMode_1.3.0.png",
      ],
      title: "选择",
      textList: ["line1", "line2", "line3", "line4", "line5", "line6"],
    },
    {
      imageList: [
        "remote_files/boardMode_1.3.0.png",
      ],
      title: "画板",
      textList: ["line1", "line2", "line3", "line4"],
    },
    {
      imageList: [
        "remote_files/borderConfig.png",
      ],
      title: "快捷操作",
      textList: ["line1", "line2", "line3", "line4"],
    },
    {
      imageList: [
        "remote_files/files.png",
      ],
      title: "文件配置",
      textList: ["line1"],
    },
  ],
  ts = () => {
    const { t } = _();
    return c(Zt, {
      slidesPerView: 1,
      spaceBetween: 20,
      modules: [qt],
      pagination: { dynamicBullets: !0, clickable: !0 },
      autoHeight: !0,
      grabCursor: !0,
      className: "max-w-[500px] xs:max-w-[80vw]",
      children: es.map((e, r) =>
        c(
          Kt,
          {
            children: c("div", {
              className: "max-h-[50vh] overflow-y-auto noScrollbar",
              children: w("div", {
                className:
                  "flex w-full rounded-2xl p-3 bg-[#66CC8920] box-border justify-between",
                children: [
                  c("div", {
                    className:
                      "shrink-0 w-[49%] flex flex-col items-center justify-start",
                    children: e.imageList.map((a, n) =>
                      c(
                        "img",
                        {
                          className:
                            "max-w-full max-h-full rounded-2xl mt-5 first:mt-0",
                          src: a,
                        },
                        n
                      )
                    ),
                  }),
                  w("div", {
                    className:
                      "w-[48%] shrink-0 p-3 rounded-2xl bg-[#eef1ff] box-border h-max",
                    children: [
                      c("div", {
                        className: "text-lg font-fredokaOne",
                        children: e.title,
                      }),
                      e.textList.map((a, n) =>
                        w(
                          "div",
                          {
                            className: "text-sm mt-3",
                            children: [n + 1, ". ", t(`info.${e.title}.${a}`)],
                          },
                          n
                        )
                      ),
                    ],
                  }),
                ],
              }),
            }),
          },
          r
        )
      ),
    });
  },
  rs = [
    { value: "en", name: "English" },
    { value: "zh", name: "\u4E2D\u6587(\u7B80\u4F53)" },
    { value: "zh-tw", name: "\u4E2D\u6587(\u7E41\u9AD4)" },
    { value: "ja", name: "\u65E5\u672C\u8A9E" },
    { value: "ko", name: "\uD55C\uAD6D\uC5B4" },
  ],
  as = () => {
    const { t, i18n: e } = _(),
      { language: r, updateLanguage: a } = O(),
      [n, s] = o.exports.useState(!1),
      i = (d) => {
        e.changeLanguage(d), a(d);
      };
    return w(U, {
      children: [
        w("div", {
          className:
            "fixed bottom-5 left-5 flex flex-row justify-center items-center px-2.5 py-1.5 rounded-full bg-[#eef1ff]",
          children: [
            c(Kn, {
              className:
                "bg-white rounded-full cursor-pointer hover:opacity-70",
              onClick: () => s(!0),
            }),
            c(Qn, {}),
          ],
        }),
        c(Be, {
          show: n,
          clickMask: () => {
            s(!1);
          },
          children: w("div", {
            className:
              "flex flex-col bg-white rounded-2xl overflow-hidden p-3 max-h-[80vh]",
            children: [
              w("div", {
                className: "flex items-center justify-between font-bold mb-4 ",
                children: [
                  w("div", {
                    className: "text-sm",
                    children: [
                      "仓库：",
                      c("a", {
                        className:
                          "link link-primary inline-block ml-1 mr-3 break-all",
                        href: "https://github.com/LHRUN/paint-board",
                        target: "_blank",
                        rel: "noreferrer",
                        children: "github.com/LHRUN/paint-board",
                      }),
                      t("info.welecome"),
                      "\u2B50\uFE0F",
                    ],
                  }),
                  w("div", {
                    className: "dropdown dropdown-bottom dropdown-end",
                    children: [
                      c("label", {
                        tabIndex: 0,
                        children: c(Jn, {
                          className:
                            "w-8 h-8 p-1 bg-[#66CC8960] rounded-md hover:bg-[#66CC8980] cursor-pointer",
                        }),
                      }),
                      c("ul", {
                        tabIndex: 0,
                        className:
                          "dropdown-content menu menu-compact shadow bg-base-100 rounded-box w-40",
                        children: rs.map((d) =>
                          c(
                            "li",
                            {
                              onClick: () => i(d.value),
                              children: c("a", {
                                className: `${d.value === r ? "active" : ""}`,
                                children: d.name,
                              }),
                            },
                            d.value
                          )
                        ),
                      }),
                    ],
                  }),
                ],
              }),
              c(ts, {}),
            ],
          }),
        }),
      ],
    });
  },
  ns = () => {
    const { t } = _(),
      e = () => {
        var r;
        (r = l.history) == null || r.clean();
      };
    return w(U, {
      children: [
        c("input", {
          type: "checkbox",
          id: "clean-modal",
          className: "modal-toggle",
        }),
        c("label", {
          htmlFor: "clean-modal",
          className: "modal cursor-pointer",
          children: w("label", {
            className:
              "modal-box relative flex flex-col justify-center items-center",
            htmlFor: "",
            children: [
              c("h3", {
                className: "text-lg font-bold text-center",
                children: t("cleanModal.title"),
              }),
              w("div", {
                className: "w-64 flex justify-between mt-10",
                children: [
                  c("label", {
                    htmlFor: "clean-modal",
                    className: "btn btn-active btn-primary btn-sm w-2/5",
                    onClick: e,
                    children: t("confirm"),
                  }),
                  c("label", {
                    htmlFor: "clean-modal",
                    className: "btn btn-active btn-ghost btn-sm w-2/5",
                    children: t("cancel"),
                  }),
                ],
              }),
            ],
          }),
        }),
      ],
    });
  },
  ss = (t) =>
    o.exports.createElement(
      "svg",
      {
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 6082,
        width: 26,
        height: 26,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M553.510259 201.860177c-312.055513 53.779187-655.249802 337.402216-45.768564 793.695176C283.646139 771.440335 83.62989 414.41051 555.277559 433.448208l1.201715 162.84822 297.307743-261.013025L552.261108 30.273979 553.510259 201.860177 553.510259 201.860177zM553.510259 201.860177",
        "p-id": 6083,
        fill: "#65CC8A",
      })
    ),
  os = (t) =>
    o.exports.createElement(
      "svg",
      {
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 6082,
        width: 26,
        height: 26,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M553.510259 201.860177c-312.055513 53.779187-655.249802 337.402216-45.768564 793.695176C283.646139 771.440335 83.62989 414.41051 555.277559 433.448208l1.201715 162.84822 297.307743-261.013025L552.261108 30.273979 553.510259 201.860177 553.510259 201.860177zM553.510259 201.860177",
        "p-id": 6083,
        fill: "#65CC8A",
      })
    ),
  is = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "28px",
        height: "28px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          { id: "System / Save" },
          o.exports.createElement("path", {
            id: "Vector",
            d: "M17 21.0002L7 21M17 21.0002L17.8031 21C18.921 21 19.48 21 19.9074 20.7822C20.2837 20.5905 20.5905 20.2843 20.7822 19.908C21 19.4806 21 18.921 21 17.8031V9.21955C21 8.77072 21 8.54521 20.9521 8.33105C20.9095 8.14 20.8393 7.95652 20.7432 7.78595C20.6366 7.59674 20.487 7.43055 20.1929 7.10378L17.4377 4.04241C17.0969 3.66374 16.9242 3.47181 16.7168 3.33398C16.5303 3.21 16.3242 3.11858 16.1073 3.06287C15.8625 3 15.5998 3 15.075 3H6.2002C5.08009 3 4.51962 3 4.0918 3.21799C3.71547 3.40973 3.40973 3.71547 3.21799 4.0918C3 4.51962 3 5.08009 3 6.2002V17.8002C3 18.9203 3 19.4796 3.21799 19.9074C3.40973 20.2837 3.71547 20.5905 4.0918 20.7822C4.5192 21 5.07899 21 6.19691 21H7M17 21.0002V17.1969C17 16.079 17 15.5192 16.7822 15.0918C16.5905 14.7155 16.2837 14.4097 15.9074 14.218C15.4796 14 14.9203 14 13.8002 14H10.2002C9.08009 14 8.51962 14 8.0918 14.218C7.71547 14.4097 7.40973 14.7155 7.21799 15.0918C7 15.5196 7 16.0801 7 17.2002V21M15 7H9",
            stroke: "#65CC8A",
            strokeWidth: 2,
            strokeLinecap: "round",
            strokeLinejoin: "round",
          })
        )
      )
    ),
  cs = (t) =>
    o.exports.createElement(
      "svg",
      {
        t: 1702137196077,
        className: "icon",
        viewBox: "0 0 1024 1024",
        xmlns: "http://www.w3.org/2000/svg",
        "p-id": 4092,
        xmlnsXlink: "http://www.w3.org/1999/xlink",
        width: 26,
        height: 26,
        ...t,
      },
      o.exports.createElement("path", {
        d: "M512 0a170.666667 170.666667 0 0 1 170.569143 164.815238L682.666667 170.666667v146.285714h146.285714a146.285714 146.285714 0 0 1 146.18819 140.8L975.238095 463.238095v24.380953a146.334476 146.334476 0 0 1-97.523809 137.947428V877.714286a146.285714 146.285714 0 0 1-140.8 146.18819L731.428571 1024H292.571429a146.285714 146.285714 0 0 1-146.188191-140.8L146.285714 877.714286V625.590857a146.358857 146.358857 0 0 1-97.426285-132.486095L48.761905 487.619048v-24.380953a146.285714 146.285714 0 0 1 140.8-146.18819L195.047619 316.952381h146.285714V170.666667A170.666667 170.666667 0 0 1 506.148571 0.097524L512 0z m268.190476 633.904762H243.809524v243.809524a48.761905 48.761905 0 0 0 41.374476 48.201143l3.754667 0.438857L292.571429 926.47619h24.380952v-46.567619a48.761905 48.761905 0 1 1 97.523809 0V926.47619l48.761905 0.024381v-133.022476a48.761905 48.761905 0 1 1 97.52381 0V926.47619h48.761905v-219.428571a48.761905 48.761905 0 1 1 97.523809 0v219.428571h24.380952a48.761905 48.761905 0 0 0 48.64-45.104761L780.190476 877.714286V633.904762z m48.761905-219.428572H195.047619a48.761905 48.761905 0 0 0-48.64 45.104762L146.285714 463.238095v24.380953a48.761905 48.761905 0 0 0 45.104762 48.64L195.047619 536.380952h633.904762a48.761905 48.761905 0 0 0 48.64-45.104762L877.714286 487.619048v-24.380953a48.761905 48.761905 0 0 0-48.761905-48.761905zM512 97.52381a73.142857 73.142857 0 0 0-73.020952 68.851809L438.857143 170.666667v146.285714h146.285714V170.666667a73.142857 73.142857 0 0 0-64.609524-72.655238l-4.242285-0.365715L512 97.52381z",
        fill: "#65CC8A",
        "p-id": 4093,
      })
    ),
  ls = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "26px",
        height: "26px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M10.5 2.0028C9.82495 2.01194 9.4197 2.05103 9.09202 2.21799C8.71569 2.40973 8.40973 2.71569 8.21799 3.09202C8.05103 3.4197 8.01194 3.82495 8.0028 4.5M19.5 2.0028C20.1751 2.01194 20.5803 2.05103 20.908 2.21799C21.2843 2.40973 21.5903 2.71569 21.782 3.09202C21.949 3.4197 21.9881 3.82494 21.9972 4.49999M21.9972 13.5C21.9881 14.175 21.949 14.5803 21.782 14.908C21.5903 15.2843 21.2843 15.5903 20.908 15.782C20.5803 15.949 20.1751 15.9881 19.5 15.9972M22 7.99999V9.99999M14.0001 2H16M5.2 22H12.8C13.9201 22 14.4802 22 14.908 21.782C15.2843 21.5903 15.5903 21.2843 15.782 20.908C16 20.4802 16 19.9201 16 18.8V11.2C16 10.0799 16 9.51984 15.782 9.09202C15.5903 8.71569 15.2843 8.40973 14.908 8.21799C14.4802 8 13.9201 8 12.8 8H5.2C4.0799 8 3.51984 8 3.09202 8.21799C2.71569 8.40973 2.40973 8.71569 2.21799 9.09202C2 9.51984 2 10.0799 2 11.2V18.8C2 19.9201 2 20.4802 2.21799 20.908C2.40973 21.2843 2.71569 21.5903 3.09202 21.782C3.51984 22 4.07989 22 5.2 22Z",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  ds = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "26px",
        height: "26px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M3.5 3.5C3.5 2.94772 3.94772 2.5 4.5 2.5H19.5C20.0523 2.5 20.5 2.94772 20.5 3.5V6.5C20.5 7.05228 20.0523 7.5 19.5 7.5H18.5C17.9477 7.5 17.5 7.05228 17.5 6.5V5.5H13.5V18.5H15.5C16.0523 18.5 16.5 18.9477 16.5 19.5V20.5C16.5 21.0523 16.0523 21.5 15.5 21.5H8.5C7.94772 21.5 7.5 21.0523 7.5 20.5V19.5C7.5 18.9477 7.94772 18.5 8.5 18.5H10.5V5.5H6.5V6.5C6.5 7.05228 6.05228 7.5 5.5 7.5H4.5C3.94772 7.5 3.5 7.05228 3.5 6.5V3.5Z",
          fill: "#65CC8A",
        })
      )
    ),
  hs = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "28px",
        height: "28px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M10 11V17",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M14 11V17",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M4 7H20",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M6 7H12H18V18C18 19.6569 16.6569 21 15 21H9C7.34315 21 6 19.6569 6 18V7Z",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M9 5C9 3.89543 9.89543 3 11 3H13C14.1046 3 15 3.89543 15 5V7H9V5Z",
          stroke: "#66CC89",
          strokeWidth: 2,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  ps = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "26px",
        height: "26px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("rect", {
          x: 4,
          y: 4,
          width: 16,
          height: 18,
          rx: 3,
          stroke: "#65CC8A",
          strokeWidth: 2,
        }),
        o.exports.createElement("path", {
          d: "M16 10L8 10",
          stroke: "#65CC8A",
          strokeWidth: 2,
          strokeLinecap: "round",
        }),
        o.exports.createElement("path", {
          d: "M16 13L8 13",
          stroke: "#65CC8A",
          strokeWidth: 2,
          strokeLinecap: "round",
        }),
        o.exports.createElement("path", {
          d: "M16 16L8 16",
          stroke: "#65CC8A",
          strokeWidth: 2,
          strokeLinecap: "round",
        })
      )
    ),
  us = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: 26,
        height: 26,
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("path", {
        d: "M3 3h7v2H5v5H3V3z",
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M21 3h-7v2h5v5h2V3z",
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M3 21h7v-2H5v-5H3v7z",
        fill: "#65CC8A",
      }),
      o.exports.createElement("path", {
        d: "M21 21h-7v-2h5v-5h2v7z",
        fill: "#65CC8A",
      })
    ),
  gs = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: 28,
        height: 28,
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("path", {
        d: "M4 9L9 4v5H4zM15 4l5 5h-5V4zM4 15l5 5v-5H4zM20 15l-5 5v-5h5z",
        fill: "#65CC8A",
      })
    ),
  ms = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "26px",
        height: "26px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          { id: "Edit / Add_Plus_Square" },
          o.exports.createElement("path", {
            id: "Vector",
            d: "M8 12H12M12 12H16M12 12V16M12 12V8M4 16.8002V7.2002C4 6.08009 4 5.51962 4.21799 5.0918C4.40973 4.71547 4.71547 4.40973 5.0918 4.21799C5.51962 4 6.08009 4 7.2002 4H16.8002C17.9203 4 18.4801 4 18.9079 4.21799C19.2842 4.40973 19.5905 4.71547 19.7822 5.0918C20.0002 5.51962 20.0002 6.07967 20.0002 7.19978V16.7998C20.0002 17.9199 20.0002 18.48 19.7822 18.9078C19.5905 19.2841 19.2842 19.5905 18.9079 19.7822C18.4805 20 17.9215 20 16.8036 20H7.19691C6.07899 20 5.5192 20 5.0918 19.7822C4.71547 19.5905 4.40973 19.2842 4.21799 18.9079C4 18.4801 4 17.9203 4 16.8002Z",
            stroke: "#65CC8A",
            strokeWidth: 2,
            strokeLinecap: "round",
            strokeLinejoin: "round",
          })
        )
      )
    ),
  fs = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "26px",
        height: "26px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement(
          "g",
          { id: "Edit / Add_Minus_Square" },
          o.exports.createElement("path", {
            id: "Vector",
            d: "M8 12H16M4 16.8002V7.2002C4 6.08009 4 5.51962 4.21799 5.0918C4.40973 4.71547 4.71547 4.40973 5.0918 4.21799C5.51962 4 6.08009 4 7.2002 4H16.8002C17.9203 4 18.4801 4 18.9079 4.21799C19.2842 4.40973 19.5905 4.71547 19.7822 5.0918C20.0002 5.51962 20.0002 6.07967 20.0002 7.19978V16.7998C20.0002 17.9199 20.0002 18.48 19.7822 18.9078C19.5905 19.2841 19.2842 19.5905 18.9079 19.7822C18.4805 20 17.9215 20 16.8036 20H7.19691C6.07899 20 5.5192 20 5.0918 19.7822C4.71547 19.5905 4.40973 19.2842 4.21799 18.9079C4 18.4801 4 17.9203 4 16.8002Z",
            stroke: "#65CC8A",
            strokeWidth: 2,
            strokeLinecap: "round",
            strokeLinejoin: "round",
          })
        )
      )
    ),
  ws = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "#65CC8A",
        width: "64px",
        height: "64px",
        viewBox: "0 0 24 24",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", { d: "M11 16h2V7h3l-4-5-4 5h3z" }),
        o.exports.createElement("path", {
          d: "M5 22h14c1.103 0 2-.897 2-2v-9c0-1.103-.897-2-2-2h-4v2h4v9H5v-9h4V9H5c-1.103 0-2 .897-2 2v9c0 1.103.897 2 2 2z",
        })
      )
    ),
  xs = (t) =>
    o.exports.createElement(
      "svg",
      {
        fill: "#65CC8A",
        width: "64px",
        height: "64px",
        viewBox: "0 0 24 24",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", { d: "m12 18 4-5h-3V2h-2v11H8z" }),
        o.exports.createElement("path", {
          d: "M19 9h-4v2h4v9H5v-9h4V9H5c-1.103 0-2 .897-2 2v9c0 1.103.897 2 2 2h14c1.103 0 2-.897 2-2v-9c0-1.103-.897-2-2-2z",
        })
      )
    ),
  Cs = ({ message: t }) => {
    const { t: e } = _();
    return c("div", {
      className: "toast toast-top toast-center",
      children: c("div", {
        className: "alert alert-success",
        children: c("div", {
          children: c("span", {
            className: "whitespace-nowrap",
            children: e(t),
          }),
        }),
      }),
    });
  },
  vs = ({ updateShow: t }) => {
    const {
        files: e,
        currentId: r,
        updateCurrentFile: a,
        updateTitle: n,
        addFile: s,
        saveJSON: i,
        uploadFile: d,
      } = ie(),
      { updateMode: h } = O(),
      [g, m] = o.exports.useState(!1),
      C = (b) => {
        a(b), l.initCanvasStorage(), h(z.DRAW);
      },
      L = (b) => {
        d(b).then((y) => {
          y
            ? (l.initCanvasStorage(), h(z.DRAW))
            : (m(!0),
              setTimeout(() => {
                m(!1);
              }, 1500));
        });
      };
    return w("div", {
      className: "drawer drawer-end fixed top-0 z-[1]",
      children: [
        c("input", {
          id: "my-drawer-4",
          type: "checkbox",
          className: "drawer-toggle",
        }),
        w("div", {
          className: "drawer-side",
          children: [
            c("label", {
              htmlFor: "my-drawer-4",
              className: "drawer-overlay",
              onClick: () => t(!1),
            }),
            w("div", {
              className:
                "h-screen bg-white px-5 py-7 overflow-hidden max-w-[80%]",
              children: [
                c("div", {
                  className: "font-fredokaOne text-2xl text-center",
                  children: "画板文件",
                }),
                w("div", {
                  className:
                    "bg-[#eef1ff] rounded-2xl mt-5 py-2 w-max max-w-full",
                  children: [
                    w("div", {
                      className: "flex justify-end items-center px-4 pb-2",
                      children: [
                        c(ms, {
                          className:
                            "hover:bg-slate-200 cursor-pointer p-1 rounded-lg w-9 h-9",
                          onClick: s,
                        }),
                        c("label", {
                          htmlFor: "delete-file-modal",
                          children: c(fs, {
                            className:
                              "hover:bg-slate-200 cursor-pointer p-1 rounded-lg w-9 h-9",
                          }),
                        }),
                        c(ws, {
                          className:
                            "hover:bg-slate-200 cursor-pointer p-1 rounded-lg w-9 h-9",
                          onClick: i,
                        }),
                        c("label", {
                          htmlFor: "file-upload",
                          className: "cursor-pointer",
                          children: c(xs, {
                            className:
                              "hover:bg-slate-200 cursor-pointer p-1 rounded-lg w-9 h-9",
                          }),
                        }),
                        c("input", {
                          type: "file",
                          accept: "application/json",
                          id: "file-upload",
                          className: "hidden",
                          onChange: (b) => {
                            var y;
                            return L(
                              (y = b.target.files) == null ? void 0 : y[0]
                            );
                          },
                        }),
                      ],
                    }),
                    c("ul", {
                      className:
                        "menu text-base-content my-2 mx-4 py-3 px-2 rounded-xl bg-white max-h-[70vh] xs:max-h-[40vh]  overflow-y-auto noScrollbar flex-nowrap max-w-full",
                      children: e.map((b) =>
                        c(
                          "li",
                          {
                            className: "my-1 block rounded-lg overflow-hidden",
                            onClick: () => C(b.id),
                            children: c("a", {
                              className: `${b.id === r ? "active" : ""}`,
                              children: c("input", {
                                value: b.title,
                                className: "px-2 max-w-full",
                                onChange: (y) => n(y.target.value, b.id),
                              }),
                            }),
                          },
                          b.id
                        )
                      ),
                    }),
                  ],
                }),
              ],
            }),
          ],
        }),
        g && c(Cs, { message: "toast.uploadFileFail" }),
      ],
    });
  };
function bs(t, e, r) {
  o.exports.useEffect(() => {
    const a = setTimeout(() => {
      t.apply(void 0, r);
    }, e);
    return () => {
      clearTimeout(a);
    };
  }, r);
}
const Ss = Math.PI / 180;
async function ys(t, e, r, a = 1, n = 0) {
  var y;
  const s = e.getContext("2d");
  if (!s) throw new Error("No 2d context");
  const i = t.naturalWidth / t.width,
    d = t.naturalHeight / t.height,
    h = (y = window.devicePixelRatio) != null ? y : 1;
  (e.width = Math.floor(r.width * i * h)),
    (e.height = Math.floor(r.height * d * h)),
    s.scale(h, h),
    (s.imageSmoothingQuality = "high");
  const g = r.x * i,
    m = r.y * d,
    C = n * Ss,
    L = t.naturalWidth / 2,
    b = t.naturalHeight / 2;
  s.save(),
    s.translate(-g, -m),
    s.translate(L, b),
    s.rotate(C),
    s.scale(a, a),
    s.translate(-L, -b),
    s.drawImage(
      t,
      0,
      0,
      t.naturalWidth,
      t.naturalHeight,
      0,
      0,
      t.naturalWidth,
      t.naturalHeight
    ),
    s.restore();
}
const ks = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "28px",
        height: "28px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M7.25 22H11.75C15.5 22 17 20.5 17 16.75V12.25C17 8.5 15.5 7 11.75 7H7.25C3.5 7 2 8.5 2 12.25V16.75C2 20.5 3.5 22 7.25 22Z",
          stroke: "#65CC8A",
          strokeWidth: 1.5,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        }),
        o.exports.createElement("path", {
          d: "M22 9C22 5.13 18.87 2 15 2L16.05 3.75",
          stroke: "#65CC8A",
          strokeWidth: 1.5,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  Ls = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "22px",
        height: "22px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M11 2C6.94493 2.0073 4.8215 2.10686 3.46447 3.46389C2 4.92835 2 7.28538 2 11.9994C2 16.7135 2 19.0705 3.46447 20.535C4.92893 21.9994 7.28596 21.9994 12 21.9994C16.714 21.9994 19.0711 21.9994 20.5355 20.535C21.8926 19.1779 21.9921 17.0545 21.9994 12.9994",
          stroke: "#65CC8A",
          strokeWidth: 1.5,
          strokeLinecap: "round",
        }),
        o.exports.createElement("path", {
          d: "M13 11L22 2M22 2H16.6562M22 2V7.34375M21 3L12 12M12 12H16M12 12V8",
          stroke: "#65CC8A",
          strokeWidth: 1.5,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    ),
  Es = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "22px",
        height: "22px",
        viewBox: "0 0 48 48",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("rect", {
          width: 48,
          height: 48,
          fill: "white",
          fillOpacity: 0.01,
        }),
        o.exports.createElement("path", {
          d: "M42 6V42M17 19L12 24M12 24L17 29M12 24H36M31 19L36 24M36 24L31 29M6 6L6 42",
          stroke: "#65CC8A",
          strokeWidth: 4,
          strokeLinecap: "round",
          strokeLinejoin: "round",
        })
      )
    );
const Ms = ({ url: t, showModal: e, setShowModal: r }) => {
    const { t: a } = _(),
      [n, s] = o.exports.useState(0),
      [i, d] = o.exports.useState(1),
      [h, g] = o.exports.useState(1),
      [m, C] = o.exports.useState(),
      [L, b] = o.exports.useState(),
      y = o.exports.useRef(null),
      v = o.exports.useRef(null),
      x = o.exports.useRef(null),
      S = o.exports.useRef(""),
      I = (M) => {
        const { width: j, height: V } = M.currentTarget,
          R = {
            unit: "px",
            x: 0.1 * j,
            y: 0.1 * V,
            width: 0.8 * j,
            height: 0.8 * V,
          };
        b({ ...R }), C({ ...R });
      },
      T = () => {
        if (y.current) {
          const { width: M, height: j } = y.current,
            V = {
              unit: "px",
              x: 0.1 * M,
              y: 0.1 * j,
              width: 0.8 * M,
              height: 0.8 * j,
            };
          b({ ...V }), C({ ...V });
        }
        s(0), d(1);
      },
      E = async () => {
        const M = y.current,
          j = v.current;
        if (!M || !j || !m) throw new Error("Crop canvas does not exist");
        const V = M.naturalWidth / M.width,
          R = M.naturalHeight / M.height,
          P = new OffscreenCanvas(m.width * V * h, m.height * R * h),
          F = P.getContext("2d");
        if (!F) throw new Error("No 2d context");
        F.drawImage(j, 0, 0, j.width, j.height, 0, 0, P.width, P.height);
        const H = await P.convertToBlob({ type: "image/png" });
        S.current && URL.revokeObjectURL(S.current),
          (S.current = URL.createObjectURL(H)),
          x.current && ((x.current.href = S.current), x.current.click(), r(!1));
      };
    return (
      bs(
        async () => {
          (m == null ? void 0 : m.width) &&
            (m == null ? void 0 : m.height) &&
            y.current &&
            v.current &&
            ys(y.current, v.current, m, i, n);
        },
        100,
        [m, i, n]
      ),
      c(Be, {
        show: e,
        clickMask: () => {
          r(!1);
        },
        children: w("div", {
          className:
            "p-6 bg-[#eef1ff] card shadow-xl overflow-auto max-w-[800px] w-[80vw] h-fit max-h-[60vh]",
          children: [
            m &&
              w("div", {
                className: "w-full flex justify-between",
                children: [
                  w("div", {
                    className: "w-[48%]",
                    children: [
                      w("div", {
                        className: "flex items-center flex-wrap gap-y-2",
                        children: [
                          c("div", {
                            className: "mr-[12px] shrink-0 tooltip",
                            "data-tip": a("downloadImage.size"),
                            children: c(Es, {}),
                          }),
                          c("div", {
                            className: "tabs tabs-boxed bg-[#333C4D] shrink-0",
                            children: [1, 2, 3].map((M) =>
                              c(
                                "a",
                                {
                                  className: `tab tab-sm flex-grow font-fredokaOne font-normal text-white ${
                                    h === M ? "tab-active" : ""
                                  }`,
                                  onClick: () => {
                                    g(M);
                                  },
                                  children: `${M}x`,
                                },
                                M
                              )
                            ),
                          }),
                        ],
                      }),
                      w("div", {
                        className: "flex items-center mt-3",
                        children: [
                          c("div", {
                            className: "mr-[6px] shrink-0 tooltip",
                            "data-tip": a("downloadImage.rotate"),
                            children: c(ks, {}),
                          }),
                          c("input", {
                            className: "range range-primary range-xs",
                            type: "range",
                            min: "0",
                            max: "360",
                            step: "1",
                            value: String(n),
                            onChange: (M) => {
                              s(Number(M.target.value));
                            },
                          }),
                        ],
                      }),
                      w("div", {
                        className: "flex items-center mt-3",
                        children: [
                          c("div", {
                            className: "mr-[12px] shrink-0 tooltip",
                            "data-tip": a("downloadImage.scale"),
                            children: c(Ls, {}),
                          }),
                          c("input", {
                            className: "range range-primary range-xs",
                            type: "range",
                            min: "0.2",
                            max: "1.5",
                            step: "0.1",
                            value: String(i),
                            onChange: (M) => {
                              d(Number(M.target.value));
                            },
                          }),
                        ],
                      }),
                    ],
                  }),
                  w("div", {
                    className: "w-[48%] flex flex-wrap gap-x-4 gap-y-2 h-fit",
                    children: [
                      c("button", {
                        className: "btn btn-ghost btn-outline btn-sm",
                        onClick: () => r(!1),
                        children: a("cancel"),
                      }),
                      c("button", {
                        className: "btn btn-secondary btn-sm",
                        onClick: T,
                        children: a("reset"),
                      }),
                      c("button", {
                        className: "btn btn-primary btn-sm",
                        onClick: E,
                        children: a("download"),
                      }),
                      c("a", {
                        href: "#hidden",
                        ref: x,
                        download: "paint-board",
                        style: {
                          position: "absolute",
                          top: "-200vh",
                          visibility: "hidden",
                        },
                        children: "Hidden download",
                      }),
                    ],
                  }),
                ],
              }),
            w("div", {
              className: "w-full flex justify-between mt-3",
              children: [
                t &&
                  c("div", {
                    className: "w-[48%] shrink-0",
                    children: c("div", {
                      className:
                        "w-fit bg-transparent bg-[length:13px_13px] bg-white flex",
                      children: c(Jt, {
                        crop: L,
                        onChange: b,
                        onComplete: C,
                        minHeight: 100,
                        minWidth: 100,
                        children: c("img", {
                          ref: y,
                          src: t,
                          style: { transform: `scale(${i}) rotate(${n}deg)` },
                          onLoad: I,
                        }),
                      }),
                    }),
                  }),
                m &&
                  c("div", {
                    className: "w-[48%] shrink-0",
                    children: c("canvas", {
                      ref: v,
                      className:
                        "object-contain border border-base-content border-dashed",
                      style: { width: m.width, height: m.height },
                    }),
                  }),
              ],
            }),
          ],
        }),
      })
    );
  },
  Ft = (t) =>
    new Promise((e, r) => {
      const a = new Image();
      (a.src = t),
        (a.onload = () => {
          const n = document.createElement("canvas"),
            s = n.getContext("2d");
          (n.width = a.width), (n.height = a.height), s.drawImage(a, 0, 0);
          const i = s.getImageData(0, 0, n.width, n.height),
            { data: d, width: h, height: g } = i;
          let m = h,
            C = g,
            L = 0,
            b = 0;
          for (let I = 0; I < g; I++)
            for (let T = 0; T < h; T++) {
              const E = (I * h + T) * 4;
              d[E + 3] !== 0 &&
                (T < m && (m = T),
                T > L && (L = T),
                I < C && (C = I),
                I > b && (b = I));
            }
          if (m > L || C > b) {
            e(t);
            return;
          }
          const y = L - m + 1,
            v = b - C + 1,
            x = s.getImageData(m, C, y, v);
          (n.width = y), (n.height = v), s.putImageData(x, 0, 0);
          const S = n.toDataURL();
          e(S);
        }),
        (a.onerror = () => r(new Error("Image loading failed")));
    }),
  Dt = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "16px",
        height: "16px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M12 7C12.5523 7 13 7.44772 13 8V13C13 13.5523 12.5523 14 12 14C11.4477 14 11 13.5523 11 13V8C11 7.44772 11.4477 7 12 7Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          d: "M12 17C12.5523 17 13 16.5523 13 16C13 15.4477 12.5523 15 12 15C11.4477 15 11 15.4477 11 16C11 16.5523 11.4477 17 12 17Z",
          fill: "#000000",
        }),
        o.exports.createElement("path", {
          fillRule: "evenodd",
          clipRule: "evenodd",
          d: "M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z",
          fill: "#000000",
        })
      )
    ),
  Is = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "64px",
        height: "64px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          d: "M20.0001 12C20.0001 13.3811 19.6425 14.7386 18.9623 15.9405C18.282 17.1424 17.3022 18.1477 16.1182 18.8587C14.9341 19.5696 13.5862 19.9619 12.2056 19.9974C10.825 20.0328 9.45873 19.7103 8.23975 19.0612",
          stroke: "#000000",
          strokeWidth: 3.55556,
          strokeLinecap: "round",
        })
      )
    ),
  gt = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "12px",
        height: "12px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fillRule: "evenodd",
          clipRule: "evenodd",
          d: "M9.55879 3.6972C10.7552 2.02216 13.2447 2.02216 14.4412 3.6972L14.6317 3.96387C14.8422 4.25867 15.1958 4.41652 15.5558 4.37652L16.4048 4.28218C18.3156 4.06988 19.9301 5.68439 19.7178 7.59513L19.6235 8.44415C19.5835 8.8042 19.7413 9.15774 20.0361 9.36831L20.3028 9.55879C21.9778 10.7552 21.9778 13.2447 20.3028 14.4412L20.0361 14.6317C19.7413 14.8422 19.5835 15.1958 19.6235 15.5558L19.7178 16.4048C19.9301 18.3156 18.3156 19.9301 16.4048 19.7178L15.5558 19.6235C15.1958 19.5835 14.8422 19.7413 14.6317 20.0361L14.4412 20.3028C13.2447 21.9778 10.7553 21.9778 9.55879 20.3028L9.36831 20.0361C9.15774 19.7413 8.8042 19.5835 8.44414 19.6235L7.59513 19.7178C5.68439 19.9301 4.06988 18.3156 4.28218 16.4048L4.37652 15.5558C4.41652 15.1958 4.25867 14.8422 3.96387 14.6317L3.6972 14.4412C2.02216 13.2447 2.02216 10.7553 3.6972 9.55879L3.96387 9.36831C4.25867 9.15774 4.41652 8.8042 4.37652 8.44414L4.28218 7.59513C4.06988 5.68439 5.68439 4.06988 7.59513 4.28218L8.44415 4.37652C8.8042 4.41652 9.15774 4.25867 9.36831 3.96387L9.55879 3.6972ZM15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071L11.8882 14.526C11.3977 15.0166 10.6023 15.0166 10.1118 14.526L8.29289 12.7071C7.90237 12.3166 7.90237 11.6834 8.29289 11.2929C8.68342 10.9024 9.31658 10.9024 9.70711 11.2929L11 12.5858L14.2929 9.29289C14.6834 8.90237 15.3166 8.90237 15.7071 9.29289Z",
        })
      )
    ),
  mt = (t) =>
    o.exports.createElement(
      "svg",
      {
        width: "12px",
        height: "12px",
        viewBox: "0 0 24 24",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg",
        ...t,
      },
      o.exports.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: 0 }),
      o.exports.createElement("g", {
        id: "SVGRepo_tracerCarrier",
        strokeLinecap: "round",
        strokeLinejoin: "round",
      }),
      o.exports.createElement(
        "g",
        { id: "SVGRepo_iconCarrier" },
        o.exports.createElement("path", {
          fillRule: "evenodd",
          clipRule: "evenodd",
          d: "M2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12ZM9.70711 8.29289C9.31658 7.90237 8.68342 7.90237 8.29289 8.29289C7.90237 8.68342 7.90237 9.31658 8.29289 9.70711L10.5858 12L8.29289 14.2929C7.90237 14.6834 7.90237 15.3166 8.29289 15.7071C8.68342 16.0976 9.31658 16.0976 9.70711 15.7071L12 13.4142L14.2929 15.7071C14.6834 16.0976 15.3166 16.0976 15.7071 15.7071C16.0976 15.3166 16.0976 14.6834 15.7071 14.2929L13.4142 12L15.7071 9.70711C16.0976 9.31658 16.0976 8.68342 15.7071 8.29289C15.3166 7.90237 14.6834 7.90237 14.2929 8.29289L12 10.5858L9.70711 8.29289Z",
        })
      )
    ),
  ee = {
    LOADING: 0,
    NO_SUPPORT_WEBGPU: 1,
    LOAD_ERROR: 2,
    LOAD_SUCCESS: 3,
    PROCESSING: 4,
    PROCESSING_SUCCESS: 5,
  },
  Ts = ({
    url: t,
    showModal: e,
    setShowModal: r,
    cancelUploadImageModal: a,
  }) => {
    const { t: n } = _(),
      [s, i] = o.exports.useState([]),
      [d, h] = o.exports.useState(),
      [g, m] = o.exports.useState(!0),
      C = o.exports.useRef(null),
      L = o.exports.useRef(),
      b = o.exports.useRef(),
      y = o.exports.useRef(),
      v = o.exports.useRef(),
      x = o.exports.useRef(),
      S = o.exports.useMemo(() => {
        switch (d) {
          case ee.LOADING:
            return "uploadImage.imageSegmentationLoading";
          case ee.NO_SUPPORT_WEBGPU:
            return "uploadImage.imageSegmentationGpuTip";
          case ee.LOAD_ERROR:
            return "uploadImage.imageSegmentationFailed";
          case ee.LOAD_SUCCESS:
            return "uploadImage.imageSegmentationSuccess";
          case ee.PROCESSING:
            return "uploadImage.imageSegmentationProcessing";
          case ee.PROCESSING_SUCCESS:
            return "uploadImage.imageSegmentationProcessed";
          default:
            return "";
        }
      }, [d]);
    o.exports.useEffect(() => {
      (async () => {
        var P, F;
        try {
          if (!e || L.current || b.current || d === ee.LOADING) return;
          if ((h(ee.LOADING), !(navigator != null && navigator.gpu))) {
            h(ee.NO_SUPPORT_WEBGPU);
            return;
          }
          const H = "Xenova/slimsam-77-uniform";
          (P = L.current) != null ||
            (L.current = await Qt.from_pretrained(H, {
              dtype: "fp16",
              device: "webgpu",
            })),
            (F = b.current) != null ||
              (b.current = await ft.from_pretrained(H)),
            h(ee.LOAD_SUCCESS);
        } catch (H) {
          console.log("err", H), h(ee.LOAD_ERROR);
        }
      })();
    }, [e]),
      o.exports.useEffect(() => {
        (async () => {
          try {
            if (!e || !L.current || !b.current || !t || d === ee.PROCESSING)
              return;
            h(ee.PROCESSING),
              j(),
              (y.current = await Ne.fromURL(t)),
              (v.current = await b.current(y.current)),
              (x.current = await L.current.get_image_embeddings(v.current)),
              h(ee.PROCESSING_SUCCESS);
          } catch (P) {
            console.log("err", P);
          }
        })();
      }, [t, L.current, b.current, e]);
    function I(P, F) {
      const H = C.current;
      if (!H) return;
      const $ = H.getContext("2d");
      (H.width !== P.width || H.height !== P.height) &&
        ((H.width = P.width), (H.height = P.height));
      const Q = $.createImageData(H.width, H.height),
        B = F.length;
      let D = 0;
      for (let X = 1; X < B; ++X) F[X] > F[D] && (D = X);
      const se = Q.data;
      for (let X = 0; X < se.length; ++X)
        if (P.data[B * X + D] === 1) {
          const Y = 4 * X;
          (se[Y] = 101),
            (se[Y + 1] = 204),
            (se[Y + 2] = 138),
            (se[Y + 3] = 255);
        }
      $.putImageData(Q, 0, 0);
    }
    const T = async (P) => {
        if (!L.current || !x.current || !b.current || !v.current) return;
        if (!P.length && C.current) {
          C.current
            .getContext("2d")
            .clearRect(0, 0, C.current.width, C.current.height);
          return;
        }
        const F = v.current.reshaped_input_sizes[0],
          H = P.map((le) => [
            le.position[0] * F[1],
            le.position[1] * F[0],
          ]).flat(1 / 0),
          $ = P.map((le) => BigInt(le.label)).flat(1 / 0),
          Q = P.length,
          B = new $e("float32", H, [1, 1, Q, 2]),
          D = new $e("int64", $, [1, 1, Q]),
          { pred_masks: se, iou_scores: X } = await L.current({
            ...x.current,
            input_points: B,
            input_labels: D,
          }),
          Y = await b.current.post_process_masks(
            se,
            v.current.original_sizes,
            v.current.reshaped_input_sizes
          );
        I(Ne.fromTensor(Y[0][0]), X.data);
      },
      E = (P, F = 0, H = 1) => Math.max(Math.min(P, H), F),
      M = (P) => {
        if (d !== ee.PROCESSING_SUCCESS) return;
        const { clientX: F, clientY: H, currentTarget: $ } = P,
          { left: Q, top: B } = $.getBoundingClientRect(),
          D = E((F - Q + $.scrollLeft) / $.scrollWidth),
          se = E((H - B + $.scrollTop) / $.scrollHeight),
          X = s.findIndex(
            (le) =>
              Math.abs(le.position[0] - D) < 0.01 &&
              Math.abs(le.position[1] - se) < 0.01 &&
              le.label === (g ? 1 : 0)
          ),
          Y = [...s];
        X !== -1
          ? Y.splice(X, 1)
          : Y.push({ position: [D, se], label: g ? 1 : 0 }),
          i(Y),
          T(Y);
      },
      j = () => {
        i([]), T([]);
      },
      V = () => {
        r(!1), j();
      },
      R = async () => {
        const P = C.current;
        if (!P || !y.current) return;
        const F = new je();
        if (!s.length) F.addImage(t);
        else {
          const H = P.getContext("2d"),
            [$, Q] = [P.width, P.height],
            B = H.getImageData(0, 0, $, Q),
            D = new OffscreenCanvas($, Q),
            se = D.getContext("2d"),
            X = B.data,
            Y = y.current.data;
          for (let me = 0; me < $ * Q; ++me) {
            const Wt = 3 * me,
              Ue = 4 * me;
            if (X[Ue + 3] > 0)
              for (let Ee = 0; Ee < 3; ++Ee) X[Ue + Ee] = Y[Wt + Ee];
          }
          se.putImageData(B, 0, 0);
          const le = URL.createObjectURL(await D.convertToBlob());
          Ft(le).then((me) => {
            F.addImage(me);
          });
        }
        V(), a();
      };
    return c(Be, {
      show: e,
      clickMask: () => {
        V();
      },
      children: w("div", {
        className: "p-6 bg-[#eef1ff] card shadow-xl overflow-auto",
        children: [
          w("div", {
            className:
              "flex flex-wrap items-center gap-x-3 gap-y-2 max-w-[60vw]",
            children: [
              c("button", {
                className: "btn btn-ghost btn-outline btn-sm",
                onClick: V,
                children: n("cancel"),
              }),
              c("button", {
                className: `btn btn-primary btn-sm ${
                  d !== ee.PROCESSING_SUCCESS ? "btn-disabled" : ""
                }`,
                onClick: R,
                children: n("uploadImage.upload"),
              }),
              c("button", {
                className: "btn btn-primary btn-sm",
                onClick: j,
                children: n("uploadImage.clearPoints"),
              }),
              w("div", {
                className:
                  "flex items-center text-sm h-8 px-3 text-primary-content gap-x-2 rounded-lg transition-all font-semibold bg-[#65CC8A]",
                children: [
                  c("span", {
                    className: `cursor-pointer ${
                      g ? "text-primary-content" : "text-[#00000020]"
                    }`,
                    onClick: () => m(!0),
                    children: n("uploadImage.positivePoint"),
                  }),
                  w("label", {
                    className: "swap swap-rotate",
                    children: [
                      c("input", {
                        readOnly: !0,
                        type: "checkbox",
                        checked: g,
                      }),
                      c(gt, { className: "swap-on w-6 h-6 fill-[#FFD401]" }),
                      c(mt, { className: "swap-off fill-[#F44237] w-6 h-6" }),
                    ],
                  }),
                  c("span", {
                    className: `cursor-pointer ${
                      g ? "text-[#00000020]" : "text-primary-content"
                    }`,
                    onClick: () => m(!1),
                    children: n("uploadImage.negativePoint"),
                  }),
                ],
              }),
            ],
          }),
          w("div", {
            className: "text-xs text-base-content mt-2 max-w-[60vw] flex",
            children: [
              c(Dt, { className: "shrink-0" }),
              c("span", { className: "ml-1", children: n(S) }),
            ],
          }),
          w("div", {
            id: "test-image-container",
            className: `relative mt-4 border border-base-content border-dashed rounded-lg h-[60vh] max-h-[500px] w-fit max-w-[60vw] overflow-y-hidden ${
              d === ee.PROCESSING_SUCCESS
                ? "overflow-x-auto"
                : "overflow-x-hidden"
            }`,
            onClick: M,
            children: [
              d !== ee.PROCESSING_SUCCESS &&
                c("div", {
                  className:
                    "absolute z-[3] top-0 left-0 w-full h-full bg-slate-400 bg-opacity-70 flex justify-center items-center",
                  children: c(Is, { className: "animate-spin" }),
                }),
              w("div", {
                className: "h-full w-max relative overflow-hidden",
                children: [
                  c("img", { className: "h-full max-w-none", src: t }),
                  c("canvas", {
                    ref: C,
                    className:
                      "absolute top-0 left-0 h-full w-full z-[1] opacity-60",
                  }),
                  s.map((P, F) => {
                    switch (P.label) {
                      case 1:
                        return c(
                          gt,
                          {
                            className:
                              "w-[24px] h-[24px] absolute z-[2] -ml-[13px] -mt-[14px] fill-[#FFD401]",
                            style: {
                              top: `${P.position[1] * 100}%`,
                              left: `${P.position[0] * 100}%`,
                            },
                          },
                          F
                        );
                      case 0:
                        return c(
                          mt,
                          {
                            className:
                              "w-[24px] h-[24px] absolute z-[2] -ml-[13px] -mt-[14px] fill-[#F44237]",
                            style: {
                              top: `${P.position[1] * 100}%`,
                              left: `${P.position[0] * 100}%`,
                            },
                          },
                          F
                        );
                      default:
                        return null;
                    }
                  }),
                ],
              }),
            ],
          }),
        ],
      }),
    });
  },
  oe = {
    LOADING: 0,
    NO_SUPPORT_WEBGPU: 1,
    LOAD_ERROR: 2,
    LOAD_SUCCESS: 3,
    PROCESSING: 4,
    PROCESSING_SUCCESS: 5,
  },
  Ps = ({ url: t, showModal: e, setShowModal: r }) => {
    const { t: a } = _(),
      [n, s] = o.exports.useState(!1),
      [i, d] = o.exports.useState(),
      [h, g] = o.exports.useState(""),
      [m, C] = o.exports.useState(!0),
      L = o.exports.useRef(),
      b = o.exports.useRef(),
      y = o.exports.useMemo(() => {
        switch (i) {
          case oe.LOADING:
            return "uploadImage.removeBackgroundLoading";
          case oe.NO_SUPPORT_WEBGPU:
            return "uploadImage.removeBackgroundGpuTip";
          case oe.LOAD_ERROR:
            return "uploadImage.removeBackgroundFailed";
          case oe.LOAD_SUCCESS:
            return "uploadImage.removeBackgroundSuccess";
          case oe.PROCESSING:
            return "uploadImage.removeBackgroundProcessing";
          case oe.PROCESSING_SUCCESS:
            return "uploadImage.removeBackgroundProcessingSuccess";
          default:
            return "";
        }
      }, [i]);
    o.exports.useEffect(() => {
      (async () => {
        var I, T;
        try {
          if (!e || L.current || b.current || i === oe.LOADING) return;
          if ((d(oe.LOADING), !(navigator != null && navigator.gpu))) {
            d(oe.NO_SUPPORT_WEBGPU);
            return;
          }
          const E = "Xenova/modnet";
          Ze.backends.onnx.wasm && (Ze.backends.onnx.wasm.proxy = !1),
            (I = L.current) != null ||
              (L.current = await er.from_pretrained(E, { device: "webgpu" })),
            (T = b.current) != null ||
              (b.current = await ft.from_pretrained(E)),
            d(oe.LOAD_SUCCESS);
        } catch (E) {
          console.log("err", E), d(oe.LOAD_ERROR);
        }
      })();
    }, [e]);
    const v = () => {
        r(!1), s(!1), C(!0), g("");
      },
      x = async () => {
        if (h) {
          C(!m);
          return;
        }
        const I = L.current,
          T = b.current;
        if (!I || !T) return;
        d(oe.PROCESSING);
        const E = await Ne.fromURL(t),
          { pixel_values: M } = await T(E),
          { output: j } = await I({ input: M }),
          V = (
            await Ne.fromTensor(j[0].mul(255).to("uint8")).resize(
              E.width,
              E.height
            )
          ).data,
          R = document.createElement("canvas");
        (R.width = E.width), (R.height = E.height);
        const P = R.getContext("2d");
        P.drawImage(E.toCanvas(), 0, 0);
        const F = P.getImageData(0, 0, E.width, E.height);
        for (let H = 0; H < V.length; ++H) F.data[4 * H + 3] = V[H];
        P.putImageData(F, 0, 0),
          g(R.toDataURL("image/png")),
          d(oe.PROCESSING_SUCCESS),
          C(!1);
      },
      S = () => {
        const I = new je();
        m
          ? (I.addImage(t), v())
          : h &&
            (Ft(h).then((T) => {
              I.addImage(T);
            }),
            v());
      };
    return c(Be, {
      show: e,
      clickMask: () => {
        v();
      },
      children: w("div", {
        className: "p-6 bg-[#eef1ff] card shadow-xl overflow-auto",
        children: [
          w("div", {
            className:
              "flex flex-wrap items-center gap-x-3 gap-y-2 w-[50vw] max-w-[400px]",
            children: [
              c("button", {
                className: "btn btn-ghost btn-outline btn-sm",
                onClick: v,
                children: a("cancel"),
              }),
              c("button", {
                className: "btn btn-primary btn-sm",
                onClick: S,
                children: a("uploadImage.upload"),
              }),
              c("button", {
                className: `btn btn-primary btn-sm ${
                  [oe.LOAD_SUCCESS, oe.PROCESSING_SUCCESS, void 0].includes(i)
                    ? ""
                    : "btn-disabled"
                }`,
                onClick: x,
                children: a(
                  m ? "uploadImage.removeBackground" : "uploadImage.restore"
                ),
              }),
              c("button", {
                className: "btn btn-sm btn-primary",
                onClick: () => s(!0),
                children: a("uploadImage.imageSegmentation"),
              }),
            ],
          }),
          w("div", {
            className:
              "text-xs text-base-content mt-2 w-[50vw] max-w-[400px] flex",
            children: [
              c(Dt, { className: "shrink-0" }),
              c("span", { className: "ml-1", children: a(y) }),
            ],
          }),
          w("div", {
            className:
              "relative mt-4 border border-base-content border-dashed rounded-lg overflow-hidden",
            children: [
              c("img", {
                className: `w-[50vw] max-w-[400px] h-[50vh] max-h-[400px] transition-opacity duration-300 object-contain ${
                  m ? "opacity-100" : "opacity-0"
                }`,
                src: t,
              }),
              h &&
                c("img", {
                  className: `w-full h-full absolute top-0 left-0 z-[2] transition-opacity duration-300 object-contain ${
                    m ? "opacity-0" : "opacity-100"
                  }`,
                  src: h,
                }),
            ],
          }),
          c(Ts, {
            url: t,
            showModal: n,
            setShowModal: s,
            cancelUploadImageModal: v,
          }),
        ],
      }),
    });
  },
  Rs = Ve(),
  Ns = () => {
    const { t } = _(),
      { mode: e } = O(),
      [r, a] = o.exports.useState(!1),
      [n, s] = o.exports.useState(!0),
      [i, d] = o.exports.useState(!1),
      [h, g] = o.exports.useState(""),
      [m, C] = o.exports.useState(!1),
      [L, b] = o.exports.useState(""),
      [y, v] = o.exports.useState(!1),
      x = o.exports.useCallback(async () => {
        try {
          document.fullscreenElement
            ? await document.exitFullscreen()
            : await document.documentElement.requestFullscreen();
        } catch (R) {
          console.error("fullscreen error:", R);
        }
      }, []);
    o.exports.useEffect(() => {
      const R = () => {
        d(!!document.fullscreenElement);
      };
      return (
        document.addEventListener("fullscreenchange", R),
        () => {
          document.removeEventListener("fullscreenchange", R);
        }
      );
    }, []);
    const S = () => {
        l.copyObject();
      },
      I = () => {
        l.deleteObject();
      },
      T = () => {
        var R;
        (R = l.history) == null || R.undo();
      },
      E = () => {
        var R;
        (R = l.history) == null || R.redo();
      },
      M = () => {
        var R;
        (R = l.textElement) == null || R.loadText();
      },
      j = (R) => {
        var H;
        const P = (H = R.target.files) == null ? void 0 : H[0];
        if (!P) return;
        const F = new FileReader();
        (F.onload = ($) => {
          var B;
          const Q = (B = $.target) == null ? void 0 : B.result;
          Q && Q && typeof Q == "string" && (b(Q), v(!0)),
            (R.target.value = "");
        }),
          F.readAsDataURL(P);
      },
      V = () => {
        if (l.canvas) {
          const R = l.canvas.toDataURL();
          g(R), C(!0);
        }
      };
    return w(U, {
      children: [
        w("div", {
          className:
            "fixed bottom-5 left-2/4 -translate-x-2/4 flex items-center bg-[#eef1ff] rounded-full xs:flex-col xs:right-5 xs:left-auto xs:translate-x-0 xs:justify-normal xs:max-h-[70vh] xs:overflow-y-auto xs:noScrollbar",
          children: [
            n &&
              w(U, {
                children: [
                  c("div", {
                    onClick: T,
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 pl-3 pr-2 rounded-l-full hover:bg-slate-200 xs:pl-2 xs:rounded-l-none xs:rounded-t-full",
                    "data-tip": t("operate.undo"),
                    children: c(ss, {
                      className: "transform scale-x-[-1] scale-y-[1]",
                    }),
                  }),
                  c("div", {
                    onClick: E,
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                    "data-tip": t("operate.redo"),
                    children: c(os, {}),
                  }),
                  [z.SELECT, z.Board].includes(e) &&
                    w(U, {
                      children: [
                        c("div", {
                          onClick: S,
                          className:
                            "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                          "data-tip": t("operate.copy"),
                          children: c(ls, {}),
                        }),
                        c("div", {
                          onClick: I,
                          className:
                            "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                          "data-tip": t("operate.delete"),
                          children: c(hs, {}),
                        }),
                      ],
                    }),
                  c("div", {
                    "data-tip": t("operate.text"),
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                    onClick: M,
                    children: c(ds, {}),
                  }),
                  w("div", {
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                    "data-tip": t("operate.image"),
                    children: [
                      c("label", {
                        htmlFor: "image-upload",
                        className: "cursor-pointer",
                        children: c(Ot, {}),
                      }),
                      c("input", {
                        type: "file",
                        id: "image-upload",
                        accept: ".jpeg, .jpg, .png",
                        className: "hidden",
                        onChange: j,
                      }),
                    ],
                  }),
                  c("label", {
                    htmlFor: "clean-modal",
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                    "data-tip": t("operate.clean"),
                    children: c(cs, {}),
                  }),
                  c("div", {
                    onClick: V,
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                    "data-tip": t("operate.save"),
                    children: c(is, {}),
                  }),
                  !Rs &&
                    c("div", {
                      onClick: x,
                      className:
                        "min-xs:tooltip cursor-pointer py-1.5 px-2 hover:bg-slate-200",
                      "data-tip": t(
                        i ? "operate.exitFullscreen" : "operate.fullscreen"
                      ),
                      children: i ? c(gs, {}) : c(us, {}),
                    }),
                  c("label", {
                    htmlFor: "my-drawer-4",
                    className:
                      "min-xs:tooltip cursor-pointer py-1.5 pl-2 pr-3 rounded-r-full hover:bg-slate-200 xs:pr-2 xs:rounded-r-none xs:rounded-b-full",
                    "data-tip": t("operate.fileList"),
                    onClick: () => a(!0),
                    children: c(ps, {}),
                  }),
                ],
              }),
            w("label", {
              className:
                "btn btn-circle swap swap-rotate w-7 h-7 min-h-0 my-1.5 mx-2 min-xs:hidden",
              children: [
                c("input", { type: "checkbox", onChange: () => s((R) => !R) }),
                c(_t, { className: "swap-on fill-current" }),
                c(Bt, { className: "swap-off fill-current" }),
              ],
            }),
          ],
        }),
        r && c(vs, { updateShow: a }),
        m && h && c(Ms, { url: h, showModal: m, setShowModal: C }),
        c(Ps, { url: L, showModal: y, setShowModal: v }),
      ],
    });
  },
  As = () => {
    const { t } = _(),
      { files: e, deleteFile: r } = ie(),
      { updateMode: a } = O(),
      n = () => {
        e.length > 1 && (r(), l.initCanvasStorage(), a(z.DRAW));
      };
    return w(U, {
      children: [
        c("input", {
          type: "checkbox",
          id: "delete-file-modal",
          className: "modal-toggle",
        }),
        c("label", {
          htmlFor: "delete-file-modal",
          className: "modal cursor-pointer",
          children: w("label", {
            className:
              "modal-box relative flex flex-col justify-center items-center",
            htmlFor: "",
            children: [
              c("h3", {
                className: "text-lg font-bold text-center",
                children: t("deleteFileModal.title"),
              }),
              w("div", {
                className: "w-64 flex justify-between mt-10",
                children: [
                  c("label", {
                    htmlFor: "delete-file-modal",
                    className: "btn btn-active btn-primary btn-sm w-2/5",
                    onClick: n,
                    children: t("confirm"),
                  }),
                  c("label", {
                    htmlFor: "delete-file-modal",
                    className: "btn btn-active btn-ghost btn-sm w-2/5",
                    children: t("cancel"),
                  }),
                ],
              }),
            ],
          }),
        }),
      ],
    });
  },
  Os = () => {
    const t = o.exports.useRef(null),
      [e, r] = o.exports.useState(!1);
    return (
      o.exports.useEffect(
        () => (
          t.current &&
            l.initCanvas(t.current).then((a) => {
              r(a);
            }),
          () => {
            l.removeCanvas();
          }
        ),
        []
      ),
      w("div", {
        children: [
          c("div", {
            className:
              "w-screen h-screen flex justify-center items-center bg-slate-100",
            children: c("canvas", { className: "w-full h-full block", ref: t }),
          }),
          e &&
            w(U, {
              children: [c(qn, {}), c(as, {}), c(ns, {}), c(As, {}), c(Ns, {})],
            }),
        ],
      })
    );
  };
function _s() {
  return c("div", { children: c(Os, {}) });
}
const Bs = "Confirm",
  Fs = "Cancel",
  Ds = "Download",
  Ws = "Reset",
  Hs = { draw: "Draw", eraser: "Eraser", select: "Select", board: "Board" },
  Gs = {
    drawType: "Draw Type",
    drawStyle: "Draw Style",
    drawWidth: "Draw Width",
    drawColor: "Draw Color",
    lineType: "Line Type",
    shadow: "Shadow",
    AI: "AI",
    shapeType: "Shape Type",
    shapeCount: "Shape Count",
    materialType: "Material Type",
    multiColorType: "MultiColor Type",
    drawText: "Draw Text",
    fontFamily: "Font Family",
    shapeLinePointCount: "Point Count",
    borderType: "Border Type",
    borderStyle: "Border Style",
    fillStyle: "Fill Style",
    eraserWidth: "Eraser Width",
    opacity: "Opacity",
    layer: "Layer",
    imageFilters: "Image Filters",
    fontStyle: "Font Style",
    canvasBackground: "Canvas Background",
    canvasSize: "Canvas Size",
    drawCache: "Draw Cache",
    guideLine: "GuideLine",
  },
  Xs = { width: "Width", height: "Height" },
  Vs = { freeStyle: "FreeStyle", shape: "Shape" },
  Ys = {
    basic: "Basic",
    rainbow: "Rainbow",
    shape: "Shape",
    material: "Material",
    pixels: "Pixels",
    multiColor: "MultiColor",
    text: "Text",
    multiLine: "MultiLine",
    reticulate: "Reticulate",
    multiPoint: "MultiPoint",
    wiggle: "Wiggle",
    thorn: "Thorn",
  },
  zs = {
    undo: "undo",
    redo: "redo",
    copy: "copy",
    delete: "delete",
    text: "add text",
    image: "upload image",
    clean: "clean",
    save: "Save as image",
    fileList: "File List",
    fullscreen: "Enter Fullscreen",
    exitFullscreen: "Exit Fullscreen",
  },
  js = {
    welecome: "Welcome to star",
    FreeStyle: {
      line1:
        "Provides 12 different styles of brushes, including Basic Brush, Rainbow Brush, Multi-Shape Brush, Multi-Material Brush, Pixel Brush, Multi-Color Brush, Text Brush, Multi-Line Connection Brush, Reticulate Brush, Multi-Point Connection Brush, Wiggle Brush, Thorn Brush. Satisfy the diversified drawing",
      line2: "All brushes support color and brush width configurations",
      line3:
        "MultiShape allows flexible configuration of shape types and quantities",
      line4:
        "Material and MultiColor allows you to adjust the material type of the brush",
      line5: "Text drawing support for cyclic text and font configuration",
    },
    ShapeDraw: {
      line1:
        "A variety of common shapes are provided for drawing, with support for multi-point segments and arrows. The shapes support border and fill styles.",
    },
    EraserMode: {
      line1: "Eraser mode linearly erases all content",
      line2: "Supports linear width configurations",
    },
    SelectMode: {
      line1:
        "In selection mode, you can click on the content of the drawing to select it",
      line2:
        "Click handle supports drag and drop, zoom and rotate operations, providing flexible editing options",
      line3: "Selecting images supports multiple filter configurations",
      line4: "Support for font configuration when selecting text",
      line5:
        "Layer settings are supported for all drawings, including Move Layer Up, Move Layer Down, Move to Top, and Move to Bottom",
      line6: "All drawings support transparency configurations",
    },
    BoardMode: {
      line1:
        "The drawing board supports background configuration, including colour, background image, and transparency",
      line2:
        "The drawing board supports customized width and height configurations",
      line3:
        "Support for drawing cache enable. Enabling caching will improve drawing performance in the presence of large amounts of drawing content, while disabling caching will improve canvas clarity.",
      line4: "Supports guide line on and off",
    },
    BorderConfig: {
      line1:
        "The bottom left button shows the current zoom ratio in real time, click it to reset the zoom ratio",
      line2:
        "The list of buttons in the center, in order from left to right, are: Undo, Redo, Copy Current Selection, Delete Current Selection, Draw Text, Upload Image, Clear Drawing, Save as Image, and Open File List",
      line3:
        "PC: Hold down the Space key and click the left mouse button to move the canvas, scroll the mouse wheel to realize the canvas zoom, hold down the Backspace key to delete the selected content, and hold down the Ctrl + V keys to paste the clipboard image at the same time",
      line4:
        "Mobile: support for dragging and zooming the canvas after a two-finger press",
    },
    FileConfig: {
      line1:
        "Multi-file configuration: support multiple canvas switching, each canvas can be customized title, add, delete, and provide upload and download",
    },
  },
  Us = { title: "Confirm clearing content?" },
  $s = { title: "Confirm deleting the current file?" },
  Zs = { uploadFileFail: "Upload failed, please try again" },
  qs = {
    Sepia: "Sepia",
    Invert: "Invert",
    BlackWhite: "BlackWhite",
    Grayscale: "Grayscale",
    Blur: "Blur",
    Vintage: "Vintage",
    BlendColor: "BlendColor",
    Brownie: "Brownie",
    Kodachrome: "Kodachrome",
    Pixelate: "Pixelate",
    Polaroid: "Polaroid",
    Technicolor: "Technicolor",
    Brightness: "Brightness",
    Noise: "Noise",
    Convolute: "Emboss",
  },
  Ks = {
    bold: "Bold",
    italic: "Italic",
    underLine: "UnderLine",
    lineThrough: "LineThrough",
  },
  Js = {
    cacheTip:
      "In the presence of a large amount of drawing content, enabling caching will improve drawing performance, while disabling caching will improve canvas sharpness",
  },
  Qs = {
    tip: "Please feel free to draw...",
    loading: "Loading data, please wait...",
    error: "Something went wrong. Please try again later.",
  },
  eo = {
    removeBackground: "Remove Background",
    removeBackgroundGpuTip:
      "WebGPU is not supported in this browser, to use the remove background function, please use the latest version of Google Chrome",
    removeBackgroundLoading: "Remove background function loading",
    removeBackgroundFailed: "Remove background function failed to load",
    removeBackgroundSuccess: "Remove background function loaded successfully",
    removeBackgroundProcessing: "Remove Background Processing",
    removeBackgroundProcessingSuccess: "Remove Background Processing Success",
    restore: "Restore",
    upload: "Upload",
    imageSegmentation: "Image Segmentation",
    clearPoints: "Clear Points",
    imageSegmentationLoading: "Image Segmentation function Loading",
    imageSegmentationFailed: "Image Segmentation function failed to load",
    imageSegmentationSuccess: "Image Segmentation function loaded successfully",
    imageSegmentationProcessing: "Image Processing...",
    imageSegmentationProcessed:
      "The image has been processed successfully, you can click on the image to mark it, the green mask area is the segmentation area.",
    imageSegmentationGpuTip:
      "WebGPU is not supported in this browser, to use the image segmentation function, please use the latest version of Google Chrome.",
    positivePoint: "Positive",
    negativePoint: "Negative",
  },
  to = { rotate: "Rotate", scale: "Scale", size: "Size" },
  ro = { eraser: "Eraser", erasable: "Erasable" },
  ao = {
    confirm: Bs,
    cancel: Fs,
    download: Ds,
    reset: Ws,
    tool: Hs,
    title: Gs,
    canvasSize: Xs,
    drawType: Vs,
    style: Ys,
    operate: zs,
    info: js,
    cleanModal: Us,
    deleteFileModal: $s,
    toast: Zs,
    filters: qs,
    fontStyle: Ks,
    boardConfig: Js,
    request: Qs,
    uploadImage: eo,
    downloadImage: to,
    eraserConfig: ro,
  },
  no = "\u786E\u8BA4",
  so = "\u53D6\u6D88",
  oo = "\u4E0B\u8F7D",
  io = "\u91CD\u7F6E",
  co = {
    draw: "\u7ED8\u753B",
    eraser: "\u6A61\u76AE\u64E6",
    select: "\u9009\u62E9",
    board: "\u753B\u677F",
  },
  lo = {
    drawType: "\u7ED8\u753B\u7C7B\u578B",
    drawStyle: "\u7ED8\u753B\u98CE\u683C",
    drawWidth: "\u753B\u7B14\u5BBD\u5EA6",
    drawColor: "\u753B\u7B14\u989C\u8272",
    lineType: "\u753B\u7B14\u7C7B\u578B",
    shadow: "\u9634\u5F71",
    AI: "AI",
    shapeType: "\u5F62\u72B6\u7C7B\u578B",
    shapeCount: "\u5F62\u72B6\u6570\u91CF",
    materialType: "\u7D20\u6750\u7C7B\u578B",
    multiColorType: "\u591A\u8272\u7C7B\u578B",
    drawText: "\u6587\u5B57\u5185\u5BB9",
    fontFamily: "\u5B57\u4F53",
    shapeLinePointCount: "\u7EBF\u6BB5\u7AEF\u70B9",
    borderType: "\u8FB9\u6846\u7C7B\u578B",
    borderStyle: "\u8FB9\u6846\u6837\u5F0F",
    fillStyle: "\u586B\u5145\u6837\u5F0F",
    eraserWidth: "\u6A61\u76AE\u64E6\u5BBD\u5EA6",
    opacity: "\u900F\u660E\u5EA6",
    layer: "\u56FE\u5C42",
    imageFilters: "\u56FE\u50CF\u6EE4\u955C",
    fontStyle: "\u5B57\u4F53\u6837\u5F0F",
    canvasBackground: "\u753B\u677F\u80CC\u666F",
    canvasSize: "\u753B\u677F\u5C3A\u5BF8",
    drawCache: "\u7ED8\u5236\u7F13\u5B58",
    guideLine: "\u8F85\u52A9\u7EBF",
  },
  ho = { width: "\u5BBD\u5EA6", height: "\u9AD8\u5EA6" },
  po = {
    freeStyle: "\u81EA\u7531\u7ED8\u753B",
    shape: "\u5F62\u72B6\u7ED8\u753B",
  },
  uo = {
    basic: "\u57FA\u7840",
    rainbow: "\u5F69\u8679 ",
    shape: "\u591A\u5F62\u72B6",
    material: "\u7D20\u6750",
    pixels: "\u50CF\u7D20",
    multiColor: "\u591A\u8272",
    text: "\u6587\u5B57",
    multiLine: "\u591A\u7EBF\u8FDE\u63A5",
    reticulate: "\u7F51\u72B6",
    multiPoint: "\u591A\u70B9\u8FDE\u63A5",
    wiggle: "\u6CE2\u6D6A\u66F2\u7EBF",
    thorn: "\u8346\u68D8",
  },
  go = {
    undo: "\u64A4\u9500",
    redo: "\u91CD\u505A",
    copy: "\u590D\u5236",
    delete: "\u5220\u9664",
    text: "\u6DFB\u52A0\u6587\u5B57",
    image: "\u4E0A\u4F20\u56FE\u7247",
    clean: "\u6E05\u9664\u753B\u677F",
    save: "\u4FDD\u5B58\u4E3A\u56FE\u7247",
    fileList: "\u6587\u4EF6\u5217\u8868",
    fullscreen: "\u8FDB\u5165\u5168\u5C4F",
    exitFullscreen: "\u9000\u51FA\u5168\u5C4F",
  },
  mo = {
    welecome: "\u6B22\u8FCEStar",
    自由绘制: {
      line1:
        "\u63D0\u4F9B\u4E86 12 \u79CD\u4E0D\u540C\u98CE\u683C\u7684\u753B\u7B14\uFF0C\u5305\u62EC\u57FA\u672C\u753B\u7B14\uFF0C\u5F69\u8679\u753B\u7B14\uFF0C\u591A\u5F62\u72B6\u753B\u7B14\uFF0C\u591A\u7D20\u6750\u753B\u7B14\uFF0C\u50CF\u7D20\u753B\u7B14\uFF0C\u591A\u8272\u753B\u7B14\uFF0C\u6587\u5B57\u753B\u7B14\uFF0C\u591A\u7EBF\u8FDE\u63A5\u753B\u7B14\uFF0C\u7F51\u72B6\u753B\u7B14\uFF0C\u591A\u70B9\u8FDE\u63A5\u753B\u7B14\uFF0C\u6CE2\u6D6A\u66F2\u7EBF\u753B\u7B14\uFF0C\u8346\u68D8\u753B\u7B14\u3002\u6EE1\u8DB3\u591A\u6837\u5316\u7684\u7ED8\u753B",
      line2:
        "\u6240\u6709\u753B\u7B14\u5747\u652F\u6301\u989C\u8272\u548C\u753B\u7B14\u5BBD\u5EA6\u7684\u914D\u7F6E",
      line3:
        "\u591A\u5F62\u72B6\u53EF\u4EE5\u7075\u6D3B\u914D\u7F6E\u5F62\u72B6\u7C7B\u578B\u548C\u6570\u91CF",
      line4:
        "\u7D20\u6750\u548C\u591A\u8272\u53EF\u4EE5\u8C03\u6574\u753B\u7B14\u7684\u7D20\u6750\u7C7B\u578B",
      line5:
        "\u6587\u5B57\u7ED8\u5236\u652F\u6301\u5FAA\u73AF\u6587\u6848\u914D\u7F6E\u548C\u5B57\u4F53\u4FEE\u6539",
    },
    形状绘制: {
      line1:
        "\u63D0\u4F9B\u4E86\u591A\u79CD\u5E38\u89C1\u5F62\u72B6\u7684\u7ED8\u5236, \u5E76\u652F\u6301\u591A\u7AEF\u70B9\u7EBF\u6BB5\u4EE5\u53CA\u7BAD\u5934. \u5E76\u4E14\u8FD9\u4E9B\u5F62\u72B6\u5747\u652F\u6301\u8FB9\u6846\u548C\u586B\u5145\u7684\u6837\u5F0F\u914D\u7F6E",
    },
    橡皮擦: {
      line1:
        "\u6A61\u76AE\u64E6\u6A21\u5F0F\u53EF\u4EE5\u7EBF\u6027\u64E6\u9664\u6240\u6709\u5185\u5BB9",
      line2: "\u652F\u6301\u7EBF\u6027\u5BBD\u5EA6\u914D\u7F6E",
    },
    选择: {
      line1:
        "\u5728\u9009\u62E9\u6A21\u5F0F\u4E0B\uFF0C\u53EF\u4EE5\u901A\u8FC7\u70B9\u51FB\u7ED8\u753B\u5185\u5BB9\u8FDB\u884C\u6846\u9009",
      line2:
        "\u70B9\u51FB\u624B\u67C4\u652F\u6301\u62D6\u62FD\u3001\u7F29\u653E\u548C\u65CB\u8F6C\u64CD\u4F5C\uFF0C\u63D0\u4F9B\u7075\u6D3B\u7684\u7F16\u8F91\u65B9\u5F0F",
      line3:
        "\u9009\u62E9\u56FE\u7247\u652F\u6301\u591A\u79CD\u6EE4\u955C\u914D\u7F6E",
      line4:
        "\u9009\u62E9\u6587\u5B57\u65F6\uFF0C\u652F\u6301\u5B57\u4F53\u8BBE\u7F6E",
      line5:
        "\u6240\u6709\u7ED8\u5236\u5185\u5BB9\u5747\u652F\u6301\u56FE\u5C42\u8BBE\u7F6E\uFF0C\u5305\u62EC\u5411\u4E0A\u79FB\u52A8\u5C42\u7EA7\u3001\u5411\u4E0B\u79FB\u52A8\u5C42\u7EA7\u3001\u79FB\u52A8\u81F3\u9876\u5C42\u548C\u79FB\u52A8\u81F3\u5E95\u5C42",
      line6:
        "\u6240\u6709\u7ED8\u5236\u5185\u5BB9\u652F\u6301\u900F\u660E\u5EA6\u914D\u7F6E",
    },
    画板: {
      line1:
        "\u753B\u677F\u652F\u6301\u914D\u7F6E\u80CC\u666F\u914D\u7F6E, \u5305\u62EC\u989C\u8272, \u80CC\u666F\u56FE, \u900F\u660E\u5EA6",
      line2:
        "\u753B\u677F\u652F\u6301\u81EA\u5B9A\u4E49\u5BBD\u9AD8\u914D\u7F6E",
      line3:
        "\u652F\u6301\u7ED8\u5236\u7F13\u5B58\u5F00\u542F. \u5728\u5B58\u5728\u5927\u91CF\u7ED8\u5236\u5185\u5BB9\u7684\u60C5\u51B5\u4E0B\uFF0C\u542F\u7528\u7F13\u5B58\u5C06\u63D0\u9AD8\u7ED8\u5236\u6027\u80FD\uFF0C\u800C\u7981\u7528\u7F13\u5B58\u5219\u4F1A\u63D0\u5347\u753B\u5E03\u6E05\u6670\u5EA6",
      line4:
        "\u652F\u6301\u8F85\u52A9\u7EBF\u7684\u5F00\u542F\u4E0E\u5173\u95ED",
    },
    快捷操作: {
      line1:
        "\u5DE6\u4E0B\u89D2\u6309\u94AE\u5B9E\u65F6\u663E\u793A\u5F53\u524D\u7F29\u653E\u6BD4\u4F8B\uFF0C\u70B9\u51FB\u5373\u53EF\u91CD\u7F6E\u7F29\u653E\u6BD4\u4F8B",
      line2:
        "\u4E2D\u95F4\u6309\u94AE\u5217\u8868\u6309\u4ECE\u5DE6\u5230\u53F3\u7684\u987A\u5E8F\u5206\u522B\u4E3A\uFF1A\u64A4\u9500\u3001\u53CD\u64A4\u9500\u3001\u590D\u5236\u5F53\u524D\u9009\u62E9\u5185\u5BB9\u3001\u5220\u9664\u5F53\u524D\u9009\u62E9\u5185\u5BB9\u3001\u7ED8\u5236\u6587\u5B57\u3001\u4E0A\u4F20\u56FE\u7247\u3001\u6E05\u9664\u7ED8\u5236\u5185\u5BB9\u3001\u4FDD\u5B58\u4E3A\u56FE\u7247\u3001\u6253\u5F00\u6587\u4EF6\u5217\u8868",
      line3:
        "\u7535\u8111\u7AEF\uFF1A\u6309\u4F4F Space \u952E\u5E76\u70B9\u51FB\u9F20\u6807\u5DE6\u952E\u53EF\u79FB\u52A8\u753B\u5E03\uFF0C\u6EDA\u52A8\u9F20\u6807\u6EDA\u8F6E\u5B9E\u73B0\u753B\u5E03\u7F29\u653E\uFF0C\u6309\u4F4F Backspace \u952E\u53EF\u5220\u9664\u5DF2\u9009\u5185\u5BB9\uFF0C\u540C\u65F6\u6309\u4F4F Ctrl \u952E + V \u952E\u53EF\u7C98\u8D34\u526A\u8D34\u677F\u56FE\u7247",
      line4:
        "\u79FB\u52A8\u7AEF\uFF1A\u652F\u6301\u53CC\u6307\u6309\u538B\u540E\u62D6\u62FD\u548C\u7F29\u653E\u753B\u5E03",
    },
    文件配置: {
      line1:
        "\u591A\u6587\u4EF6\u914D\u7F6E\uFF1A\u652F\u6301\u591A\u4E2A\u753B\u5E03\u5207\u6362\uFF0C\u6BCF\u4E2A\u753B\u5E03\u53EF\u81EA\u5B9A\u4E49\u6807\u9898\u3001\u589E\u52A0\u3001\u5220\u9664\uFF0C\u5E76\u63D0\u4F9B\u4E0A\u4F20\u548C\u4E0B\u8F7D\u529F\u80FD",
    },
  },
  fo = { title: "\u786E\u8BA4\u6E05\u9664\u5185\u5BB9\uFF1F" },
  wo = {
    title: "\u786E\u8BA4\u5220\u9664\u5F53\u524D\u6587\u4EF6\u5417\uFF1F",
  },
  xo = { uploadFileFail: "\u4E0A\u4F20\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5" },
  Co = {
    Sepia: "\u590D\u53E4",
    Invert: "\u5E95\u7247",
    BlackWhite: "\u9ED1\u767D",
    Grayscale: "\u7070\u5EA6",
    Blur: "\u6A21\u7CCA",
    Vintage: "\u53E4\u5178",
    BlendColor: "\u6DF7\u8272",
    Brownie: "\u68D5\u4ED9",
    Kodachrome: "\u80F6\u7247",
    Pixelate: "\u50CF\u7D20",
    Polaroid: "\u5B9D\u4E3D\u6765",
    Technicolor: "\u5F69\u8272",
    Brightness: "\u589E\u4EAE",
    Noise: "\u566A\u70B9",
    Convolute: "\u6D6E\u96D5",
  },
  vo = {
    bold: "\u7C97\u4F53",
    italic: "\u659C\u4F53",
    underLine: "\u4E0B\u5212\u7EBF",
    lineThrough: "\u5220\u9664\u7EBF",
  },
  bo = {
    cacheTip:
      "\u5728\u5B58\u5728\u5927\u91CF\u7ED8\u5236\u5185\u5BB9\u7684\u60C5\u51B5\u4E0B\uFF0C\u542F\u7528\u7F13\u5B58\u5C06\u63D0\u9AD8\u7ED8\u5236\u6027\u80FD\uFF0C\u800C\u7981\u7528\u7F13\u5B58\u5219\u4F1A\u63D0\u5347\u753B\u5E03\u6E05\u6670\u5EA6",
  },
  So = {
    tip: "\u8BF7\u81EA\u7531\u7ED8\u753B...",
    loading: "\u6B63\u5728\u52A0\u8F7D\u6570\u636E\uFF0C\u8BF7\u7A0D\u5019...",
    error: "\u51FA\u9519\u4E86\u3002\u8BF7\u7A0D\u540E\u518D\u8BD5\u3002",
  },
  yo = {
    removeBackground: "\u53BB\u9664\u80CC\u666F",
    removeBackgroundGpuTip:
      "\u672C\u6D4F\u89C8\u5668\u4E0D\u652F\u6301WebGPU, \u8981\u4F7F\u7528\u53BB\u9664\u80CC\u666F\u529F\u80FD\u8BF7\u4F7F\u7528\u6700\u65B0\u7248\u8C37\u6B4C\u6D4F\u89C8\u5668",
    removeBackgroundLoading:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F7D\u4E2D",
    removeBackgroundFailed:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F7D\u5931\u8D25",
    removeBackgroundSuccess:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F7D\u6210\u529F",
    removeBackgroundProcessing: "\u53BB\u9664\u80CC\u666F\u5904\u7406\u4E2D",
    removeBackgroundProcessingSuccess:
      "\u53BB\u9664\u80CC\u666F\u5904\u7406\u6210\u529F",
    restore: "\u8FD8\u539F",
    upload: "\u4E0A\u4F20",
    imageSegmentation: "\u56FE\u50CF\u5206\u5272",
    clearPoints: "\u6E05\u9664\u6807\u8BB0\u70B9",
    imageSegmentationLoading:
      "\u56FE\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F7D\u4E2D",
    imageSegmentationFailed:
      "\u56FE\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F7D\u5931\u8D25",
    imageSegmentationSuccess:
      "\u56FE\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F7D\u6210\u529F",
    imageSegmentationProcessing: "\u5904\u7406\u56FE\u50CF\u4E2D",
    imageSegmentationProcessed:
      "\u56FE\u50CF\u5904\u7406\u6210\u529F, \u53EF\u70B9\u51FB\u56FE\u50CF\u8FDB\u884C\u6807\u8BB0, \u7EFF\u8272\u8499\u5C42\u533A\u57DF\u5C31\u662F\u5206\u5272\u533A\u57DF",
    imageSegmentationGpuTip:
      "\u672C\u6D4F\u89C8\u5668\u4E0D\u652F\u6301WebGPU, \u8981\u4F7F\u7528\u56FE\u50CF\u5206\u5272\u529F\u80FD\u8BF7\u4F7F\u7528\u6700\u65B0\u7248\u8C37\u6B4C\u6D4F\u89C8\u5668",
    positivePoint: "\u6B63\u6807\u8BB0",
    negativePoint: "\u8D1F\u6807\u8BB0",
  },
  ko = { rotate: "\u65CB\u8F6C", scale: "\u7F29\u653E", size: "\u5C3A\u5BF8" },
  Lo = { eraser: "\u6A61\u76AE\u64E6", erasable: "\u53EF\u64E6\u9664" },
  Eo = {
    confirm: no,
    cancel: so,
    download: oo,
    reset: io,
    tool: co,
    title: lo,
    canvasSize: ho,
    drawType: po,
    style: uo,
    operate: go,
    info: mo,
    cleanModal: fo,
    deleteFileModal: wo,
    toast: xo,
    filters: Co,
    fontStyle: vo,
    boardConfig: bo,
    request: So,
    uploadImage: yo,
    downloadImage: ko,
    eraserConfig: Lo,
  },
  Mo = "\u78BA\u8A8D",
  Io = "\u53D6\u6D88",
  To = "\u4E0B\u8F09",
  Po = "\u91CD\u7F6E",
  Ro = {
    draw: "\u7E6A\u756B",
    eraser: "\u6A61\u76AE\u64E6",
    select: "\u9078\u64C7",
    board: "\u756B\u677F",
  },
  No = {
    drawType: "\u7E6A\u756B\u985E\u578B",
    drawStyle: "\u7E6A\u756B\u98A8\u683C",
    drawWidth: "\u756B\u7B46\u5BEC\u5EA6",
    drawColor: "\u756B\u7B46\u984F\u8272",
    lineType: "\u756B\u7B46\u985E\u578B",
    shadow: "\u9670\u5F71",
    AI: "AI",
    shapeType: "\u5F62\u72C0\u985E\u578B",
    shapeCount: "\u5F62\u72C0\u6578\u91CF",
    materialType: "\u7D20\u6750\u985E\u578B",
    multiColorType: "\u591A\u8272\u985E\u578B",
    drawText: "\u6587\u5B57\u5167\u5BB9",
    fontFamily: "\u5B57\u9AD4",
    shapeLinePointCount: "\u7DDA\u6BB5\u7AEF\u9EDE",
    borderType: "\u908A\u6846\u985E\u578B",
    borderStyle: "\u908A\u6846\u6A23\u5F0F",
    fillStyle: "\u586B\u5145\u6A23\u5F0F",
    eraserWidth: "\u6A61\u76AE\u64E6\u5BEC\u5EA6",
    opacity: "\u900F\u660E\u5EA6",
    layer: "\u5716\u5C64",
    imageFilters: "\u5716\u50CF\u6FFE\u93E1",
    fontStyle: "\u5B57\u9AD4\u6A23\u5F0F",
    canvasBackground: "\u756B\u677F\u80CC\u666F",
    canvasSize: "\u756B\u677F\u5C3A\u5BF8",
    drawCache: "\u7E6A\u88FD\u7DE9\u5B58",
    guideLine: "\u8F14\u52A9\u7DDA",
  },
  Ao = { width: "\u5BEC\u5EA6", height: "\u9AD8\u5EA6" },
  Oo = {
    freeStyle: "\u81EA\u7531\u7E6A\u756B",
    shape: "\u5F62\u72C0\u7E6A\u756B",
  },
  _o = {
    basic: "\u57FA\u790E",
    rainbow: "\u5F69\u8679 ",
    shape: "\u591A\u5F62\u72C0",
    material: "\u7D20\u6750",
    pixels: "\u50CF\u7D20",
    multiColor: "\u591A\u8272",
    text: "\u6587\u5B57",
    multiLine: "\u591A\u7DDA\u9023\u63A5",
    reticulate: "\u7DB2\u72C0",
    multiPoint: "\u591A\u9EDE\u9023\u63A5",
    wiggle: "\u6CE2\u6D6A\u66F2\u7DDA",
    thorn: "\u834A\u68D8",
  },
  Bo = {
    undo: "\u64A4\u92B7",
    redo: "\u91CD\u505A",
    copy: "\u8907\u88FD",
    delete: "\u522A\u9664",
    text: "\u6DFB\u52A0\u6587\u5B57",
    image: "\u4E0A\u50B3\u5716\u7247",
    clean: "\u6E05\u9664\u756B\u677F",
    save: "\u4FDD\u5B58\u7232\u5716\u7247",
    fileList: "\u6587\u4EF6\u5217\u8868",
    fullscreen: "\u9032\u5165\u5168\u87A2\u5E55",
    exitFullscreen: "\u9000\u51FA\u5168\u87A2\u5E55",
  },
  Fo = {
    welecome: "\u6B61\u8FCEStar",
    FreeStyle: {
      line1:
        "\u63D0\u4F9B\u4E86 12 \u7A2E\u4E0D\u540C\u98A8\u683C\u7684\u756B\u7B46\uFF0C\u5305\u62EC\u57FA\u672C\u756B\u7B46\uFF0C\u5F69\u8679\u756B\u7B46\uFF0C\u591A\u5F62\u72C0\u756B\u7B46\uFF0C\u591A\u7D20\u6750\u756B\u7B46\uFF0C\u50CF\u7D20\u756B\u7B46\uFF0C\u591A\u8272\u756B\u7B46\uFF0C\u6587\u5B57\u756B\u7B46\uFF0C\u591A\u7DDA\u9023\u63A5\u756B\u7B46\uFF0C\u7DB2\u72C0\u756B\u7B46\uFF0C\u591A\u9EDE\u9023\u63A5\u756B\u7B46\uFF0C\u6CE2\u6D6A\u66F2\u7DDA\u756B\u7B46\uFF0C\u834A\u68D8\u756B\u7B46\u3002\u6EFF\u8DB3\u591A\u6A23\u5316\u7684\u7E6A\u756B",
      line2:
        "\u6240\u6709\u756B\u7B46\u5747\u652F\u6301\u984F\u8272\u548C\u756B\u7B46\u5BEC\u5EA6\u7684\u914D\u7F6E",
      line3:
        "\u591A\u5F62\u72C0\u53EF\u4EE5\u9748\u6D3B\u914D\u7F6E\u5F62\u72C0\u985E\u578B\u548C\u6578\u91CF",
      line4:
        "\u7D20\u6750\u548C\u591A\u8272\u53EF\u4EE5\u8ABF\u6574\u756B\u7B46\u7684\u7D20\u6750\u985E\u578B",
      line5:
        "\u6587\u5B57\u7E6A\u88FD\u652F\u6301\u5FAA\u74B0\u6587\u6848\u914D\u7F6E\u548C\u5B57\u9AD4\u4FEE\u6539",
    },
    ShapeDraw: {
      line1:
        "\u63D0\u4F9B\u4E86\u591A\u7A2E\u5E38\u898B\u5F62\u72C0\u7684\u7E6A\u88FD, \u4E26\u652F\u6301\u591A\u7AEF\u9EDE\u7DDA\u6BB5\u4EE5\u53CA\u7BAD\u982D. \u4E26\u4E14\u9019\u4E9B\u5F62\u72C0\u5747\u652F\u6301\u908A\u6846\u548C\u586B\u5145\u7684\u6A23\u5F0F\u914D\u7F6E",
    },
    EraserMode: {
      line1:
        "\u6A61\u76AE\u64E6\u6A21\u5F0F\u53EF\u4EE5\u7DDA\u6027\u64E6\u9664\u6240\u6709\u5167\u5BB9",
      line2: "\u652F\u6301\u7DDA\u6027\u5BEC\u5EA6\u914D\u7F6E",
    },
    SelectMode: {
      line1:
        "\u5728\u9078\u64C7\u6A21\u5F0F\u4E0B\uFF0C\u53EF\u4EE5\u901A\u904E\u9EDE\u64CA\u7E6A\u756B\u5167\u5BB9\u9032\u884C\u6846\u9078",
      line2:
        "\u9EDE\u64CA\u624B\u67C4\u652F\u6301\u62D6\u62FD\u3001\u7E2E\u653E\u548C\u65CB\u8F49\u64CD\u4F5C\uFF0C\u63D0\u4F9B\u9748\u6D3B\u7684\u7DE8\u8F2F\u65B9\u5F0F",
      line3:
        "\u9078\u64C7\u5716\u7247\u652F\u6301\u591A\u7A2E\u6FFE\u93E1\u914D\u7F6E",
      line4:
        "\u9078\u64C7\u6587\u5B57\u6642\uFF0C\u652F\u6301\u5B57\u9AD4\u8A2D\u7F6E",
      line5:
        "\u6240\u6709\u7E6A\u88FD\u5167\u5BB9\u5747\u652F\u6301\u5716\u5C64\u8A2D\u7F6E\uFF0C\u5305\u62EC\u5411\u4E0A\u79FB\u52D5\u5C64\u7D1A\u3001\u5411\u4E0B\u79FB\u52D5\u5C64\u7D1A\u3001\u79FB\u52D5\u81F3\u9802\u5C64\u548C\u79FB\u52D5\u81F3\u5E95\u5C64",
      line6:
        "\u6240\u6709\u7E6A\u88FD\u5167\u5BB9\u652F\u6301\u900F\u660E\u5EA6\u914D\u7F6E",
    },
    BoardMode: {
      line1:
        "\u756B\u677F\u652F\u6301\u914D\u7F6E\u80CC\u666F\u914D\u7F6E, \u5305\u62EC\u984F\u8272, \u80CC\u666F\u5716, \u900F\u660E\u5EA6",
      line2:
        "\u756B\u677F\u652F\u6301\u81EA\u5B9A\u7FA9\u5BEC\u9AD8\u914D\u7F6E",
      line3:
        "\u652F\u6301\u7E6A\u88FD\u7DE9\u5B58\u958B\u5553. \u5728\u5B58\u5728\u5927\u91CF\u7E6A\u88FD\u5167\u5BB9\u7684\u60C5\u6CC1\u4E0B\uFF0C\u5553\u7528\u7DE9\u5B58\u5C07\u63D0\u9AD8\u7E6A\u88FD\u6027\u80FD\uFF0C\u800C\u7981\u7528\u7DE9\u5B58\u5247\u6703\u63D0\u5347\u756B\u5E03\u6E05\u6670\u5EA6",
      line4:
        "\u652F\u6301\u8F14\u52A9\u7DDA\u7684\u958B\u5553\u8207\u95DC\u9589",
    },
    BorderConfig: {
      line1:
        "\u5DE6\u4E0B\u89D2\u6309\u9215\u5BE6\u6642\u986F\u793A\u7576\u524D\u7E2E\u653E\u6BD4\u4F8B\uFF0C\u9EDE\u64CA\u5373\u53EF\u91CD\u7F6E\u7E2E\u653E\u6BD4\u4F8B",
      line2:
        "\u4E2D\u9593\u6309\u9215\u5217\u8868\u6309\u5F9E\u5DE6\u5230\u53F3\u7684\u9806\u5E8F\u5206\u5225\u7232\uFF1A\u64A4\u92B7\u3001\u53CD\u64A4\u92B7\u3001\u8907\u88FD\u7576\u524D\u9078\u64C7\u5167\u5BB9\u3001\u522A\u9664\u7576\u524D\u9078\u64C7\u5167\u5BB9\u3001\u7E6A\u88FD\u6587\u5B57\u3001\u4E0A\u50B3\u5716\u7247\u3001\u6E05\u9664\u7E6A\u88FD\u5167\u5BB9\u3001\u4FDD\u5B58\u7232\u5716\u7247\u3001\u6253\u958B\u6587\u4EF6\u5217\u8868",
      line3:
        "\u96FB\u8166\u7AEF\uFF1A\u6309\u4F4F Space \u9375\u4E26\u9EDE\u64CA\u9F20\u6A19\u5DE6\u9375\u53EF\u79FB\u52D5\u756B\u5E03\uFF0C\u6EFE\u52D5\u9F20\u6A19\u6EFE\u8F2A\u5BE6\u73FE\u756B\u5E03\u7E2E\u653E\uFF0C\u6309\u4F4F Backspace \u9375\u53EF\u522A\u9664\u5DF2\u9078\u5167\u5BB9\uFF0C\u540C\u6642\u6309\u4F4F Ctrl \u9375 + V \u9375\u53EF\u7C98\u8CBC\u526A\u8CBC\u677F\u5716\u7247",
      line4:
        "\u79FB\u52D5\u7AEF\uFF1A\u652F\u6301\u96D9\u6307\u6309\u58D3\u5F8C\u62D6\u62FD\u548C\u7E2E\u653E\u756B\u5E03",
    },
    FileConfig: {
      line1:
        "\u591A\u6587\u4EF6\u914D\u7F6E\uFF1A\u652F\u6301\u591A\u500B\u756B\u5E03\u5207\u63DB\uFF0C\u6BCF\u500B\u756B\u5E03\u53EF\u81EA\u5B9A\u7FA9\u6A19\u984C\u3001\u589E\u52A0\u3001\u522A\u9664\uFF0C\u4E26\u63D0\u4F9B\u4E0A\u50B3\u548C\u4E0B\u8F09\u529F\u80FD",
    },
  },
  Do = { title: "\u78BA\u8A8D\u6E05\u9664\u5167\u5BB9\uFF1F" },
  Wo = {
    title: "\u78BA\u8A8D\u522A\u9664\u7576\u524D\u6587\u4EF6\u55CE\uFF1F",
  },
  Ho = { uploadFileFail: "\u4E0A\u50B3\u5931\u6557\uFF0C\u8ACB\u91CD\u8A66" },
  Go = {
    Sepia: "\u5FA9\u53E4",
    Invert: "\u5E95\u7247",
    BlackWhite: "\u9ED1\u767D",
    Grayscale: "\u7070\u5EA6",
    Blur: "\u6A21\u7CCA",
    Vintage: "\u53E4\u5178",
    BlendColor: "\u6DF7\u8272",
    Brownie: "\u68D5\u4ED9",
    Kodachrome: "\u81A0\u7247",
    Pixelate: "\u50CF\u7D20",
    Polaroid: "\u5BF6\u9E97\u4F86",
    Technicolor: "\u5F69\u8272",
    Brightness: "\u589E\u4EAE",
    Noise: "\u566A\u9EDE",
    Convolute: "\u6D6E\u96D5",
  },
  Xo = {
    bold: "\u7C97\u9AD4",
    italic: "\u659C\u9AD4",
    underLine: "\u4E0B\u5283\u7DDA",
    lineThrough: "\u522A\u9664\u7DDA",
  },
  Vo = {
    cacheTip:
      "\u5728\u5B58\u5728\u5927\u91CF\u7E6A\u88FD\u5167\u5BB9\u7684\u60C5\u6CC1\u4E0B\uFF0C\u5553\u7528\u7DE9\u5B58\u5C07\u63D0\u9AD8\u7E6A\u88FD\u6027\u80FD\uFF0C\u800C\u7981\u7528\u7DE9\u5B58\u5247\u6703\u63D0\u5347\u756B\u5E03\u6E05\u6670\u5EA6",
  },
  Yo = {
    tip: "\u8ACB\u81EA\u7531\u7E6A\u756B...",
    loading: "\u6B63\u5728\u52A0\u8F09\u6578\u64DA\uFF0C\u8ACB\u7A0D\u5019...",
    error: "\u51FA\u932F\u4E86\u3002\u8ACB\u7A0D\u5F8C\u518D\u8A66\u3002",
  },
  zo = {
    removeBackground: "\u53BB\u9664\u80CC\u666F",
    removeBackgroundGpuTip:
      "\u672C\u700F\u89BD\u5668\u4E0D\u652F\u6301WebGPU, \u8981\u4F7F\u7528\u53BB\u9664\u80CC\u666F\u529F\u80FD\u8ACB\u4F7F\u7528\u6700\u65B0\u7248\u8C37\u6B4C\u700F\u89BD\u5668",
    removeBackgroundLoading:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F09\u4E2D",
    removeBackgroundFailed:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F09\u5931\u6557",
    removeBackgroundSuccess:
      "\u53BB\u9664\u80CC\u666F\u529F\u80FD\u52A0\u8F09\u6210\u529F",
    removeBackgroundProcessing: "\u53BB\u9664\u80CC\u666F\u8655\u7406\u4E2D",
    removeBackgroundProcessingSuccess:
      "\u53BB\u9664\u80CC\u666F\u8655\u7406\u6210\u529F",
    restore: "\u9084\u539F",
    upload: "\u4E0A\u50B3",
    imageSegmentation: "\u5716\u50CF\u5206\u5272",
    clearPoints: "\u6E05\u9664\u6A19\u8A18\u9EDE",
    imageSegmentationLoading:
      "\u5716\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F09\u4E2D",
    imageSegmentationFailed:
      "\u5716\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F09\u5931\u6557",
    imageSegmentationSuccess:
      "\u5716\u50CF\u5206\u5272\u529F\u80FD\u52A0\u8F09\u6210\u529F",
    imageSegmentationProcessing: "\u8655\u7406\u5716\u50CF\u4E2D",
    imageSegmentationProcessed:
      "\u5716\u50CF\u8655\u7406\u6210\u529F, \u53EF\u9EDE\u64CA\u5716\u50CF\u9032\u884C\u6A19\u8A18, \u7DA0\u8272\u8499\u5C64\u5340\u57DF\u5C31\u662F\u5206\u5272\u5340\u57DF",
    imageSegmentationGpuTip:
      "\u672C\u700F\u89BD\u5668\u4E0D\u652F\u6301WebGPU, \u8981\u4F7F\u7528\u5716\u50CF\u5206\u5272\u529F\u80FD\u8ACB\u4F7F\u7528\u6700\u65B0\u7248\u8C37\u6B4C\u700F\u89BD\u5668",
    positivePoint: "\u6B63\u6A19\u8A18",
    negativePoint: "\u8CA0\u6A19\u8A18",
  },
  jo = { rotate: "\u65CB\u8F49", scale: "\u7E2E\u653E", size: "\u5C3A\u5BF8" },
  Uo = { eraser: "\u6A61\u76AE\u64E6", erasable: "\u53EF\u64E6\u9664" },
  $o = {
    confirm: Mo,
    cancel: Io,
    download: To,
    reset: Po,
    tool: Ro,
    title: No,
    canvasSize: Ao,
    drawType: Oo,
    style: _o,
    operate: Bo,
    info: Fo,
    cleanModal: Do,
    deleteFileModal: Wo,
    toast: Ho,
    filters: Go,
    fontStyle: Xo,
    boardConfig: Vo,
    request: Yo,
    uploadImage: zo,
    downloadImage: jo,
    eraserConfig: Uo,
  },
  Zo = "\u78BA\u8A8D",
  qo = "\u30AD\u30E3\u30F3\u30BB\u30EB",
  Ko = "\u30C0\u30A6\u30F3\u30ED\u30FC\u30C9",
  Jo = "\u30EA\u30BB\u30C3\u30C8",
  Qo = {
    draw: "\u63CF\u753B",
    eraser: "\u6D88\u3057\u30B4\u30E0",
    select: "\u9078\u629E",
    board: "\u30DC\u30FC\u30C9",
  },
  ei = {
    drawType: "\u63CF\u753B\u30BF\u30A4\u30D7",
    drawStyle: "\u63CF\u753B\u30B9\u30BF\u30A4\u30EB",
    drawWidth: "\u63CF\u753B\u5E45",
    drawColor: "\u63CF\u753B\u8272",
    lineType: "\u30E9\u30A4\u30F3\u30BF\u30A4\u30D7",
    shadow: "\u5F71",
    AI: "AI",
    shapeType: "\u56F3\u5F62\u30BF\u30A4\u30D7",
    shapeCount: "\u56F3\u5F62\u6570",
    materialType: "\u7D20\u6750\u30BF\u30A4\u30D7",
    multiColorType: "\u30DE\u30EB\u30C1\u30AB\u30E9\u30FC\u30BF\u30A4\u30D7",
    drawText: "\u30C6\u30AD\u30B9\u30C8\u63CF\u753B",
    fontFamily: "\u30D5\u30A9\u30F3\u30C8\u30D5\u30A1\u30DF\u30EA\u30FC",
    shapeLinePointCount: "\u30DD\u30A4\u30F3\u30C8\u6570",
    borderType: "\u5883\u754C\u7DDA\u30BF\u30A4\u30D7",
    borderStyle: "\u5883\u754C\u7DDA\u30B9\u30BF\u30A4\u30EB",
    fillStyle: "\u5857\u308A\u3064\u3076\u3057\u30B9\u30BF\u30A4\u30EB",
    eraserWidth: "\u6D88\u3057\u30B4\u30E0\u5E45",
    opacity: "\u4E0D\u900F\u660E\u5EA6",
    layer: "\u30EC\u30A4\u30E4\u30FC",
    imageFilters: "\u753B\u50CF\u30D5\u30A3\u30EB\u30BF\u30FC",
    fontStyle: "\u30D5\u30A9\u30F3\u30C8\u30B9\u30BF\u30A4\u30EB",
    canvasBackground: "\u30AD\u30E3\u30F3\u30D0\u30B9\u80CC\u666F",
    canvasSize: "\u30AD\u30E3\u30F3\u30D0\u30B9\u30B5\u30A4\u30BA",
    drawCache: "\u63CF\u753B\u30AD\u30E3\u30C3\u30B7\u30E5",
    guideLine: "\u30AC\u30A4\u30C9\u30E9\u30A4\u30F3",
  },
  ti = { width: "\u5E45", height: "\u9AD8\u3055" },
  ri = {
    freeStyle: "\u30D5\u30EA\u30FC\u30B9\u30BF\u30A4\u30EB",
    shape: "\u56F3\u5F62",
  },
  ai = {
    basic: "\u30D9\u30FC\u30B7\u30C3\u30AF",
    rainbow: "\u30EC\u30A4\u30F3\u30DC\u30FC",
    shape: "\u56F3\u5F62",
    material: "\u7D20\u6750",
    pixels: "\u30D4\u30AF\u30BB\u30EB",
    multiColor: "\u30DE\u30EB\u30C1\u30AB\u30E9\u30FC",
    text: "\u30C6\u30AD\u30B9\u30C8",
    multiLine: "\u30DE\u30EB\u30C1\u30E9\u30A4\u30F3",
    reticulate: "\u7DB2\u72B6",
    multiPoint: "\u30DE\u30EB\u30C1\u30DD\u30A4\u30F3\u30C8",
    wiggle: "\u30A6\u30A3\u30B0\u30EB",
    thorn: "\u30C8\u30B2",
  },
  ni = {
    undo: "\u5143\u306B\u623B\u3059",
    redo: "\u3084\u308A\u76F4\u3059",
    copy: "\u30B3\u30D4\u30FC",
    delete: "\u524A\u9664",
    text: "\u30C6\u30AD\u30B9\u30C8\u8FFD\u52A0",
    image: "\u753B\u50CF\u30A2\u30C3\u30D7\u30ED\u30FC\u30C9",
    clean: "\u30AF\u30EA\u30A2",
    save: "\u753B\u50CF\u3068\u3057\u3066\u4FDD\u5B58",
    fileList: "\u30D5\u30A1\u30A4\u30EB\u30EA\u30B9\u30C8",
    fullscreen: "\u5168\u753B\u9762\u8868\u793A",
    exitFullscreen: "\u5168\u753B\u9762\u3092\u7D42\u4E86",
  },
  si = {
    welecome: "\u30B9\u30BF\u30FC\u3078\u3088\u3046\u3053\u305D",
    FreeStyle: {
      line1:
        "\u30D9\u30FC\u30B7\u30C3\u30AF\u30D6\u30E9\u30B7\u3001\u30EC\u30A4\u30F3\u30DC\u30FC\u30D6\u30E9\u30B7\u3001\u30DE\u30EB\u30C1\u5F62\u72B6\u30D6\u30E9\u30B7\u3001\u30DE\u30EB\u30C1\u7D20\u6750\u30D6\u30E9\u30B7\u3001\u30D4\u30AF\u30BB\u30EB\u30D6\u30E9\u30B7\u3001\u30DE\u30EB\u30C1\u30AB\u30E9\u30FC\u30D6\u30E9\u30B7\u3001\u30C6\u30AD\u30B9\u30C8\u30D6\u30E9\u30B7\u3001\u30DE\u30EB\u30C1\u30E9\u30A4\u30F3\u63A5\u7D9A\u30D6\u30E9\u30B7\u3001\u7DB2\u72B6\u30D6\u30E9\u30B7\u3001\u30DE\u30EB\u30C1\u30DD\u30A4\u30F3\u30C8\u63A5\u7D9A\u30D6\u30E9\u30B7\u3001\u30A6\u30A3\u30B0\u30EB\u30D6\u30E9\u30B7\u3001\u30C8\u30B2\u30D6\u30E9\u30B7\u306A\u3069\u300112\u7A2E\u985E\u306E\u7570\u306A\u308B\u30B9\u30BF\u30A4\u30EB\u306E\u30D6\u30E9\u30B7\u3092\u63D0\u4F9B\u3057\u3066\u3044\u307E\u3059\u3002\u591A\u69D8\u306A\u63CF\u753B\u3092\u6E80\u305F\u3057\u307E\u3059",
      line2:
        "\u3059\u3079\u3066\u306E\u30D6\u30E9\u30B7\u306F\u8272\u3068\u30D6\u30E9\u30B7\u5E45\u306E\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line3:
        "\u30DE\u30EB\u30C1\u30B7\u30A7\u30A4\u30D7\u3067\u306F\u3001\u5F62\u72B6\u306E\u7A2E\u985E\u3068\u6570\u91CF\u3092\u67D4\u8EDF\u306B\u8A2D\u5B9A\u3067\u304D\u307E\u3059",
      line4:
        "\u30DE\u30C6\u30EA\u30A2\u30EB\u3068\u30DE\u30EB\u30C1\u30AB\u30E9\u30FC\u3067\u306F\u3001\u30D6\u30E9\u30B7\u306E\u7D20\u6750\u30BF\u30A4\u30D7\u3092\u8ABF\u6574\u3067\u304D\u307E\u3059",
      line5:
        "\u30C6\u30AD\u30B9\u30C8\u63CF\u753B\u306F\u5FAA\u74B0\u30C6\u30AD\u30B9\u30C8\u3068\u30D5\u30A9\u30F3\u30C8\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
    },
    ShapeDraw: {
      line1:
        "\u63CF\u753B\u7528\u306E\u69D8\u3005\u306A\u4E00\u822C\u7684\u306A\u5F62\u72B6\u304C\u63D0\u4F9B\u3055\u308C\u3001\u30DE\u30EB\u30C1\u30DD\u30A4\u30F3\u30C8\u30BB\u30B0\u30E1\u30F3\u30C8\u3068\u77E2\u5370\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059\u3002\u5F62\u72B6\u306F\u5883\u754C\u7DDA\u3068\u5857\u308A\u3064\u3076\u3057\u30B9\u30BF\u30A4\u30EB\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059\u3002",
    },
    EraserMode: {
      line1:
        "\u6D88\u3057\u30B4\u30E0\u30E2\u30FC\u30C9\u306F\u3059\u3079\u3066\u306E\u30B3\u30F3\u30C6\u30F3\u30C4\u3092\u76F4\u7DDA\u7684\u306B\u6D88\u53BB\u3057\u307E\u3059",
      line2:
        "\u7DDA\u5F62\u5E45\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
    },
    SelectMode: {
      line1:
        "\u9078\u629E\u30E2\u30FC\u30C9\u3067\u306F\u3001\u63CF\u753B\u306E\u30B3\u30F3\u30C6\u30F3\u30C4\u3092\u30AF\u30EA\u30C3\u30AF\u3057\u3066\u9078\u629E\u3067\u304D\u307E\u3059",
      line2:
        "\u30CF\u30F3\u30C9\u30EB\u3092\u30AF\u30EA\u30C3\u30AF\u3059\u308B\u3053\u3068\u3067\u30C9\u30E9\u30C3\u30B0\u30A2\u30F3\u30C9\u30C9\u30ED\u30C3\u30D7\u3001\u30BA\u30FC\u30E0\u304A\u3088\u3073\u56DE\u8EE2\u64CD\u4F5C\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3001\u67D4\u8EDF\u306A\u7DE8\u96C6\u30AA\u30D7\u30B7\u30E7\u30F3\u3092\u63D0\u4F9B\u3057\u307E\u3059",
      line3:
        "\u753B\u50CF\u306E\u9078\u629E\u306F\u8907\u6570\u306E\u30D5\u30A3\u30EB\u30BF\u30FC\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line4:
        "\u30C6\u30AD\u30B9\u30C8\u9078\u629E\u6642\u306E\u30D5\u30A9\u30F3\u30C8\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line5:
        "\u3059\u3079\u3066\u306E\u63CF\u753B\u306B\u5BFE\u3057\u3066\u3001\u30EC\u30A4\u30E4\u30FC\u3092\u4E0A\u306B\u79FB\u52D5\u3001\u30EC\u30A4\u30E4\u30FC\u3092\u4E0B\u306B\u79FB\u52D5\u3001\u6700\u4E0A\u90E8\u306B\u79FB\u52D5\u3001\u6700\u4E0B\u90E8\u306B\u79FB\u52D5\u306A\u3069\u306E\u30EC\u30A4\u30E4\u30FC\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line6:
        "\u3059\u3079\u3066\u306E\u63CF\u753B\u306F\u900F\u660E\u5EA6\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
    },
    BoardMode: {
      line1:
        "\u63CF\u753B\u30DC\u30FC\u30C9\u306F\u8272\u3001\u80CC\u666F\u753B\u50CF\u3001\u900F\u660E\u5EA6\u3092\u542B\u3080\u80CC\u666F\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line2:
        "\u63CF\u753B\u30DC\u30FC\u30C9\u306F\u30AB\u30B9\u30BF\u30DE\u30A4\u30BA\u3055\u308C\u305F\u5E45\u3068\u9AD8\u3055\u306E\u8A2D\u5B9A\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
      line3:
        "\u63CF\u753B\u30AD\u30E3\u30C3\u30B7\u30E5\u306E\u6709\u52B9\u5316\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059\u3002\u30AD\u30E3\u30C3\u30B7\u30E5\u3092\u6709\u52B9\u306B\u3059\u308B\u3068\u3001\u5927\u91CF\u306E\u63CF\u753B\u30B3\u30F3\u30C6\u30F3\u30C4\u304C\u3042\u308B\u5834\u5408\u306E\u63CF\u753B\u30D1\u30D5\u30A9\u30FC\u30DE\u30F3\u30B9\u304C\u5411\u4E0A\u3057\u307E\u3059\u304C\u3001\u30AD\u30E3\u30C3\u30B7\u30E5\u3092\u7121\u52B9\u306B\u3059\u308B\u3068\u30AD\u30E3\u30F3\u30D0\u30B9\u306E\u9BAE\u660E\u3055\u304C\u5411\u4E0A\u3057\u307E\u3059\u3002",
      line4:
        "\u30AC\u30A4\u30C9\u30E9\u30A4\u30F3\u306E\u30AA\u30F3/\u30AA\u30D5\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
    },
    BorderConfig: {
      line1:
        "\u5DE6\u4E0B\u306E\u30DC\u30BF\u30F3\u306F\u30EA\u30A2\u30EB\u30BF\u30A4\u30E0\u306E\u73FE\u5728\u306E\u30BA\u30FC\u30E0\u6BD4\u7387\u3092\u8868\u793A\u3057\u307E\u3059\u3002\u30AF\u30EA\u30C3\u30AF\u3059\u308B\u3068\u30BA\u30FC\u30E0\u6BD4\u7387\u304C\u30EA\u30BB\u30C3\u30C8\u3055\u308C\u307E\u3059",
      line2:
        "\u4E2D\u592E\u306E\u30DC\u30BF\u30F3\u30EA\u30B9\u30C8\u306F\u3001\u5DE6\u304B\u3089\u53F3\u306E\u9806\u306B\u3001\u5143\u306B\u623B\u3059\u3001\u3084\u308A\u76F4\u3059\u3001\u73FE\u5728\u306E\u9078\u629E\u3092\u30B3\u30D4\u30FC\u3001\u73FE\u5728\u306E\u9078\u629E\u3092\u524A\u9664\u3001\u30C6\u30AD\u30B9\u30C8\u63CF\u753B\u3001\u753B\u50CF\u30A2\u30C3\u30D7\u30ED\u30FC\u30C9\u3001\u63CF\u753B\u30AF\u30EA\u30A2\u3001\u753B\u50CF\u3068\u3057\u3066\u4FDD\u5B58\u3001\u30D5\u30A1\u30A4\u30EB\u30EA\u30B9\u30C8\u3092\u958B\u304F\u3067\u3059",
      line3:
        "PC: \u30B9\u30DA\u30FC\u30B9\u30AD\u30FC\u3092\u62BC\u3057\u306A\u304C\u3089\u5DE6\u30DE\u30A6\u30B9\u30DC\u30BF\u30F3\u3092\u30AF\u30EA\u30C3\u30AF\u3057\u3066\u30AD\u30E3\u30F3\u30D0\u30B9\u3092\u79FB\u52D5\u3057\u3001\u30DE\u30A6\u30B9\u30DB\u30A4\u30FC\u30EB\u3092\u30B9\u30AF\u30ED\u30FC\u30EB\u3057\u3066\u30AD\u30E3\u30F3\u30D0\u30B9\u30BA\u30FC\u30E0\u3092\u5B9F\u73FE\u3057\u3001\u30D0\u30C3\u30AF\u30B9\u30DA\u30FC\u30B9\u30AD\u30FC\u3092\u62BC\u3057\u7D9A\u3051\u3066\u9078\u629E\u3057\u305F\u30B3\u30F3\u30C6\u30F3\u30C4\u3092\u524A\u9664\u3057\u3001Ctrl + V\u30AD\u30FC\u3092\u540C\u6642\u306B\u62BC\u3057\u7D9A\u3051\u3066\u30AF\u30EA\u30C3\u30D7\u30DC\u30FC\u30C9\u753B\u50CF\u3092\u8CBC\u308A\u4ED8\u3051\u307E\u3059",
      line4:
        "\u30E2\u30D0\u30A4\u30EB: \u4E8C\u672C\u6307\u3067\u62BC\u3057\u305F\u5F8C\u306E\u30AD\u30E3\u30F3\u30D0\u30B9\u306E\u30C9\u30E9\u30C3\u30B0\u3068\u30BA\u30FC\u30E0\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3066\u3044\u307E\u3059",
    },
    FileConfig: {
      line1:
        "\u30DE\u30EB\u30C1\u30D5\u30A1\u30A4\u30EB\u8A2D\u5B9A: \u8907\u6570\u306E\u30AD\u30E3\u30F3\u30D0\u30B9\u5207\u308A\u66FF\u3048\u3092\u30B5\u30DD\u30FC\u30C8\u3057\u3001\u5404\u30AD\u30E3\u30F3\u30D0\u30B9\u306B\u30AB\u30B9\u30BF\u30DE\u30A4\u30BA\u3055\u308C\u305F\u30BF\u30A4\u30C8\u30EB\u3001\u8FFD\u52A0\u3001\u524A\u9664\u304C\u53EF\u80FD\u3067\u3001\u30A2\u30C3\u30D7\u30ED\u30FC\u30C9\u3068\u30C0\u30A6\u30F3\u30ED\u30FC\u30C9\u3092\u63D0\u4F9B\u3057\u307E\u3059",
    },
  },
  oi = {
    title:
      "\u30B3\u30F3\u30C6\u30F3\u30C4\u306E\u30AF\u30EA\u30A2\u3092\u78BA\u8A8D\u3057\u307E\u3059\u304B\uFF1F",
  },
  ii = {
    title:
      "\u73FE\u5728\u306E\u30D5\u30A1\u30A4\u30EB\u306E\u524A\u9664\u3092\u78BA\u8A8D\u3057\u307E\u3059\u304B\uFF1F",
  },
  ci = {
    uploadFileFail:
      "\u30A2\u30C3\u30D7\u30ED\u30FC\u30C9\u306B\u5931\u6557\u3057\u307E\u3057\u305F\u3002\u3082\u3046\u4E00\u5EA6\u304A\u8A66\u3057\u304F\u3060\u3055\u3044",
  },
  li = {
    Sepia: "\u30BB\u30D4\u30A2",
    Invert: "\u53CD\u8EE2",
    BlackWhite: "\u767D\u9ED2",
    Grayscale: "\u30B0\u30EC\u30FC\u30B9\u30B1\u30FC\u30EB",
    Blur: "\u307C\u304B\u3057",
    Vintage: "\u30D3\u30F3\u30C6\u30FC\u30B8",
    BlendColor: "\u30D6\u30EC\u30F3\u30C9\u30AB\u30E9\u30FC",
    Brownie: "\u30D6\u30E9\u30A6\u30CB\u30FC",
    Kodachrome: "\u30B3\u30C0\u30AF\u30ED\u30FC\u30E0",
    Pixelate: "\u30D4\u30AF\u30BB\u30EB\u5316",
    Polaroid: "\u30DD\u30E9\u30ED\u30A4\u30C9",
    Technicolor: "\u30C6\u30AF\u30CB\u30AB\u30E9\u30FC",
    Brightness: "\u660E\u308B\u3055",
    Noise: "\u30CE\u30A4\u30BA",
    Convolute: "\u30A8\u30F3\u30DC\u30B9",
  },
  di = {
    bold: "\u592A\u5B57",
    italic: "\u30A4\u30BF\u30EA\u30C3\u30AF",
    underLine: "\u4E0B\u7DDA",
    lineThrough: "\u6253\u3061\u6D88\u3057\u7DDA",
  },
  hi = {
    cacheTip:
      "\u5927\u91CF\u306E\u63CF\u753B\u30B3\u30F3\u30C6\u30F3\u30C4\u304C\u3042\u308B\u5834\u5408\u3001\u30AD\u30E3\u30C3\u30B7\u30E5\u3092\u6709\u52B9\u306B\u3059\u308B\u3068\u63CF\u753B\u30D1\u30D5\u30A9\u30FC\u30DE\u30F3\u30B9\u304C\u5411\u4E0A\u3057\u3001\u30AD\u30E3\u30C3\u30B7\u30E5\u3092\u7121\u52B9\u306B\u3059\u308B\u3068\u30AD\u30E3\u30F3\u30D0\u30B9\u306E\u9BAE\u660E\u3055\u304C\u5411\u4E0A\u3057\u307E\u3059",
  },
  pi = {
    tip: "\u81EA\u7531\u306B\u63CF\u3044\u3066\u304F\u3060\u3055\u3044...",
    loading:
      "\u30C7\u30FC\u30BF\u3092\u8AAD\u307F\u8FBC\u3093\u3067\u3044\u307E\u3059\u3002\u304A\u5F85\u3061\u304F\u3060\u3055\u3044...",
    error:
      "\u554F\u984C\u304C\u767A\u751F\u3057\u307E\u3057\u305F\u3002\u5F8C\u3067\u3082\u3046\u4E00\u5EA6\u304A\u8A66\u3057\u304F\u3060\u3055\u3044\u3002",
  },
  ui = {
    removeBackground: "\u80CC\u666F\u3092\u524A\u9664",
    removeBackgroundGpuTip:
      "\u3053\u306E\u30D6\u30E9\u30A6\u30B6\u3067\u306FWebGPU\u304C\u30B5\u30DD\u30FC\u30C8\u3055\u308C\u3066\u3044\u307E\u305B\u3093\u3002\u80CC\u666F\u524A\u9664\u6A5F\u80FD\u3092\u4F7F\u7528\u3059\u308B\u306B\u306F\u3001\u6700\u65B0\u30D0\u30FC\u30B8\u30E7\u30F3\u306EGoogle Chrome\u3092\u4F7F\u7528\u3057\u3066\u304F\u3060\u3055\u3044",
    removeBackgroundLoading:
      "\u80CC\u666F\u524A\u9664\u6A5F\u80FD\u3092\u8AAD\u307F\u8FBC\u307F\u4E2D",
    removeBackgroundFailed:
      "\u80CC\u666F\u524A\u9664\u6A5F\u80FD\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",
    removeBackgroundSuccess:
      "\u80CC\u666F\u524A\u9664\u6A5F\u80FD\u304C\u6B63\u5E38\u306B\u8AAD\u307F\u8FBC\u307E\u308C\u307E\u3057\u305F",
    removeBackgroundProcessing: "\u80CC\u666F\u524A\u9664\u51E6\u7406\u4E2D",
    removeBackgroundProcessingSuccess:
      "\u80CC\u666F\u524A\u9664\u51E6\u7406\u6210\u529F",
    restore: "\u5FA9\u5143",
    upload: "\u30A2\u30C3\u30D7\u30ED\u30FC\u30C9",
    imageSegmentation:
      "\u753B\u50CF\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3",
    clearPoints: "\u30DD\u30A4\u30F3\u30C8\u3092\u30AF\u30EA\u30A2",
    imageSegmentationLoading:
      "\u753B\u50CF\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3\u6A5F\u80FD\u3092\u8AAD\u307F\u8FBC\u307F\u4E2D",
    imageSegmentationFailed:
      "\u753B\u50CF\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3\u6A5F\u80FD\u306E\u8AAD\u307F\u8FBC\u307F\u306B\u5931\u6557\u3057\u307E\u3057\u305F",
    imageSegmentationSuccess:
      "\u753B\u50CF\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3\u6A5F\u80FD\u304C\u6B63\u5E38\u306B\u8AAD\u307F\u8FBC\u307E\u308C\u307E\u3057\u305F",
    imageSegmentationProcessing: "\u753B\u50CF\u51E6\u7406\u4E2D...",
    imageSegmentationProcessed:
      "\u753B\u50CF\u304C\u6B63\u5E38\u306B\u51E6\u7406\u3055\u308C\u307E\u3057\u305F\u3002\u753B\u50CF\u3092\u30AF\u30EA\u30C3\u30AF\u3057\u3066\u30DE\u30FC\u30AF\u3067\u304D\u307E\u3059\u3002\u7DD1\u8272\u306E\u30DE\u30B9\u30AF\u9818\u57DF\u306F\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3\u9818\u57DF\u3067\u3059\u3002",
    imageSegmentationGpuTip:
      "\u3053\u306E\u30D6\u30E9\u30A6\u30B6\u3067\u306FWebGPU\u304C\u30B5\u30DD\u30FC\u30C8\u3055\u308C\u3066\u3044\u307E\u305B\u3093\u3002\u753B\u50CF\u30BB\u30B0\u30E1\u30F3\u30C6\u30FC\u30B7\u30E7\u30F3\u6A5F\u80FD\u3092\u4F7F\u7528\u3059\u308B\u306B\u306F\u3001\u6700\u65B0\u30D0\u30FC\u30B8\u30E7\u30F3\u306EGoogle Chrome\u3092\u4F7F\u7528\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
    positivePoint: "\u30DD\u30B8\u30C6\u30A3\u30D6",
    negativePoint: "\u30CD\u30AC\u30C6\u30A3\u30D6",
  },
  gi = {
    rotate: "\u56DE\u8EE2",
    scale: "\u62E1\u5927\u7E2E\u5C0F",
    size: "\u30B5\u30A4\u30BA",
  },
  mi = {
    eraser: "\u6D88\u3057\u30B4\u30E0",
    erasable: "\u6D88\u53BB\u53EF\u80FD",
  },
  fi = {
    confirm: Zo,
    cancel: qo,
    download: Ko,
    reset: Jo,
    tool: Qo,
    title: ei,
    canvasSize: ti,
    drawType: ri,
    style: ai,
    operate: ni,
    info: si,
    cleanModal: oi,
    deleteFileModal: ii,
    toast: ci,
    filters: li,
    fontStyle: di,
    boardConfig: hi,
    request: pi,
    uploadImage: ui,
    downloadImage: gi,
    eraserConfig: mi,
  },
  wi = "\uD655\uC778",
  xi = "\uCDE8\uC18C",
  Ci = "\uB2E4\uC6B4\uB85C\uB4DC",
  vi = "\uCD08\uAE30\uD654",
  bi = {
    draw: "\uADF8\uB9AC\uAE30",
    eraser: "\uC9C0\uC6B0\uAC1C",
    select: "\uC120\uD0DD",
    board: "\uBCF4\uB4DC",
  },
  Si = {
    drawType: "\uADF8\uB9AC\uAE30 \uD0C0\uC785",
    drawStyle: "\uADF8\uB9AC\uAE30 \uC2A4\uD0C0\uC77C",
    drawWidth: "\uADF8\uB9AC\uAE30 \uB108\uBE44",
    drawColor: "\uADF8\uB9AC\uAE30 \uC0C9\uC0C1",
    lineType: "\uD68C\uC120 \uC720\uD615",
    shadow: "\uADF8\uB9BC\uC790",
    AI: "AI",
    shapeType: "\uB3C4\uD615 \uD0C0\uC785",
    shapeCount: "\uB3C4\uD615 \uAC1C\uC218",
    materialType: "\uC7AC\uC9C8 \uD0C0\uC785",
    multiColorType: "\uB2E4\uC911 \uC0C9\uC0C1 \uD0C0\uC785",
    drawText: "\uD14D\uC2A4\uD2B8 \uADF8\uB9AC\uAE30",
    fontFamily: "\uAE00\uAF34",
    shapeLinePointCount: "\uD3EC\uC778\uD2B8 \uAC1C\uC218",
    borderType: "\uD14C\uB450\uB9AC \uD0C0\uC785",
    borderStyle: "\uD14C\uB450\uB9AC \uC2A4\uD0C0\uC77C",
    fillStyle: "\uCC44\uC6B0\uAE30 \uC2A4\uD0C0\uC77C",
    eraserWidth: "\uC9C0\uC6B0\uAC1C \uB108\uBE44",
    opacity: "\uD22C\uBA85\uB3C4",
    layer: "\uB808\uC774\uC5B4",
    imageFilters: "\uC774\uBBF8\uC9C0 \uD544\uD130",
    fontStyle: "\uAE00\uAF34 \uC2A4\uD0C0\uC77C",
    canvasBackground: "\uCE94\uBC84\uC2A4 \uBC30\uACBD",
    canvasSize: "\uCE94\uBC84\uC2A4 \uD06C\uAE30",
    drawCache: "\uADF8\uB9AC\uAE30 \uCE90\uC2DC",
    guideLine: "\uC548\uB0B4\uC120",
  },
  yi = { width: "\uB108\uBE44", height: "\uB192\uC774" },
  ki = { freeStyle: "\uC790\uC720 \uC2A4\uD0C0\uC77C", shape: "\uB3C4\uD615" },
  Li = {
    basic: "\uAE30\uBCF8",
    rainbow: "\uBB34\uC9C0\uAC1C",
    shape: "\uB3C4\uD615",
    material: "\uC7AC\uC9C8",
    pixels: "\uD53D\uC140",
    multiColor: "\uB2E4\uC911 \uC0C9\uC0C1",
    text: "\uD14D\uC2A4\uD2B8",
    multiLine: "\uB2E4\uC911 \uC120",
    reticulate: "\uADF8\uBB3C\uD615",
    multiPoint: "\uB2E4\uC911 \uD3EC\uC778\uD2B8",
    wiggle: "\uC9C0\uADF8\uC7AC\uADF8",
    thorn: "\uAC00\uC2DC",
  },
  Ei = {
    undo: "\uC2E4\uD589 \uCDE8\uC18C",
    redo: "\uB2E4\uC2DC \uC2E4\uD589",
    copy: "\uBCF5\uC0AC",
    delete: "\uC0AD\uC81C",
    text: "\uD14D\uC2A4\uD2B8 \uCD94\uAC00",
    image: "\uC774\uBBF8\uC9C0 \uC5C5\uB85C\uB4DC",
    clean: "\uC9C0\uC6B0\uAE30",
    save: "\uC774\uBBF8\uC9C0\uB85C \uC800\uC7A5",
    fileList: "\uD30C\uC77C \uBAA9\uB85D",
    fullscreen: "\uC804\uCCB4 \uD654\uBA74",
    exitFullscreen: "\uC804\uCCB4 \uD654\uBA74 \uC885\uB8CC",
  },
  Mi = {
    welecome: "\uBCC4\uC810 \uD658\uC601\uD569\uB2C8\uB2E4",
    FreeStyle: {
      line1:
        "\uAE30\uBCF8 \uBE0C\uB7EC\uC2DC, \uBB34\uC9C0\uAC1C \uBE0C\uB7EC\uC2DC, \uB2E4\uC911 \uB3C4\uD615 \uBE0C\uB7EC\uC2DC, \uB2E4\uC911 \uC7AC\uC9C8 \uBE0C\uB7EC\uC2DC, \uD53D\uC140 \uBE0C\uB7EC\uC2DC, \uB2E4\uC911 \uC0C9\uC0C1 \uBE0C\uB7EC\uC2DC, \uD14D\uC2A4\uD2B8 \uBE0C\uB7EC\uC2DC, \uB2E4\uC911 \uC120 \uC5F0\uACB0 \uBE0C\uB7EC\uC2DC, \uADF8\uBB3C\uD615 \uBE0C\uB7EC\uC2DC, \uB2E4\uC911 \uD3EC\uC778\uD2B8 \uC5F0\uACB0 \uBE0C\uB7EC\uC2DC, \uC9C0\uADF8\uC7AC\uADF8 \uBE0C\uB7EC\uC2DC, \uAC00\uC2DC \uBE0C\uB7EC\uC2DC \uB4F1 12\uAC00\uC9C0 \uB2E4\uC591\uD55C \uC2A4\uD0C0\uC77C\uC758 \uBE0C\uB7EC\uC2DC\uB97C \uC81C\uACF5\uD569\uB2C8\uB2E4. \uB2E4\uC591\uD55C \uADF8\uB9AC\uAE30 \uC694\uAD6C \uCDA9\uC871",
      line2:
        "\uBAA8\uB4E0 \uBE0C\uB7EC\uC2DC\uB294 \uC0C9\uC0C1 \uBC0F \uBE0C\uB7EC\uC2DC \uB108\uBE44 \uAD6C\uC131\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4",
      line3:
        "\uB2E4\uC911 \uB3C4\uD615\uC740 \uB3C4\uD615 \uC720\uD615 \uBC0F \uC218\uB7C9\uC758 \uC720\uC5F0\uD55C \uAD6C\uC131\uC744 \uD5C8\uC6A9\uD569\uB2C8\uB2E4",
      line4:
        "\uC7AC\uC9C8 \uBC0F \uB2E4\uC911 \uC0C9\uC0C1\uC744 \uD1B5\uD574 \uBE0C\uB7EC\uC2DC\uC758 \uC7AC\uC9C8 \uC720\uD615\uC744 \uC870\uC815\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4",
      line5:
        "\uC21C\uD658 \uD14D\uC2A4\uD2B8 \uBC0F \uAE00\uAF34 \uAD6C\uC131\uC744 \uC704\uD55C \uD14D\uC2A4\uD2B8 \uADF8\uB9AC\uAE30 \uC9C0\uC6D0",
    },
    ShapeDraw: {
      line1:
        "\uB2E4\uC591\uD55C \uC77C\uBC18 \uB3C4\uD615\uC744 \uADF8\uB9AC\uAE30 \uC704\uD574 \uC81C\uACF5\uB418\uBA70, \uB2E4\uC911 \uD3EC\uC778\uD2B8 \uC138\uADF8\uBA3C\uD2B8 \uBC0F \uD654\uC0B4\uD45C\uB97C \uC9C0\uC6D0\uD569\uB2C8\uB2E4. \uB3C4\uD615\uC740 \uD14C\uB450\uB9AC \uBC0F \uCC44\uC6B0\uAE30 \uC2A4\uD0C0\uC77C\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4.",
    },
    EraserMode: {
      line1:
        "\uC9C0\uC6B0\uAC1C \uBAA8\uB4DC\uB294 \uBAA8\uB4E0 \uB0B4\uC6A9\uC744 \uC120\uD615\uC73C\uB85C \uC9C0\uC6C1\uB2C8\uB2E4",
      line2: "\uC120\uD615 \uB108\uBE44 \uAD6C\uC131 \uC9C0\uC6D0",
    },
    SelectMode: {
      line1:
        "\uC120\uD0DD \uBAA8\uB4DC\uC5D0\uC11C\uB294 \uADF8\uB9BC\uC758 \uB0B4\uC6A9\uC744 \uD074\uB9AD\uD558\uC5EC \uC120\uD0DD\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4",
      line2:
        "\uD578\uB4E4 \uD074\uB9AD\uC740 \uB4DC\uB798\uADF8 \uC564 \uB4DC\uB86D, \uD655\uB300/\uCD95\uC18C \uBC0F \uD68C\uC804 \uC791\uC5C5\uC744 \uC9C0\uC6D0\uD558\uC5EC \uC720\uC5F0\uD55C \uD3B8\uC9D1 \uC635\uC158\uC744 \uC81C\uACF5\uD569\uB2C8\uB2E4",
      line3:
        "\uC774\uBBF8\uC9C0 \uC120\uD0DD \uC2DC \uB2E4\uC591\uD55C \uD544\uD130 \uAD6C\uC131 \uC9C0\uC6D0",
      line4:
        "\uD14D\uC2A4\uD2B8 \uC120\uD0DD \uC2DC \uAE00\uAF34 \uAD6C\uC131 \uC9C0\uC6D0",
      line5:
        "\uBAA8\uB4E0 \uADF8\uB9BC\uC5D0 \uB300\uD574 \uB808\uC774\uC5B4 \uC704\uB85C \uC774\uB3D9, \uB808\uC774\uC5B4 \uC544\uB798\uB85C \uC774\uB3D9, \uB9E8 \uC704\uB85C \uC774\uB3D9 \uBC0F \uB9E8 \uC544\uB798\uB85C \uC774\uB3D9 \uB4F1\uC758 \uB808\uC774\uC5B4 \uC124\uC815\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4",
      line6:
        "\uBAA8\uB4E0 \uADF8\uB9BC\uC740 \uD22C\uBA85\uB3C4 \uAD6C\uC131\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4",
    },
    BoardMode: {
      line1:
        "\uADF8\uB9BC\uD310\uC740 \uC0C9\uC0C1, \uBC30\uACBD \uC774\uBBF8\uC9C0 \uBC0F \uD22C\uBA85\uB3C4\uB97C \uD3EC\uD568\uD55C \uBC30\uACBD \uAD6C\uC131\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4",
      line2:
        "\uADF8\uB9BC\uD310\uC740 \uC0AC\uC6A9\uC790 \uC815\uC758 \uB108\uBE44 \uBC0F \uB192\uC774 \uAD6C\uC131\uC744 \uC9C0\uC6D0\uD569\uB2C8\uB2E4",
      line3:
        "\uADF8\uB9AC\uAE30 \uCE90\uC2DC \uD65C\uC131\uD654\uB97C \uC9C0\uC6D0\uD569\uB2C8\uB2E4. \uCE90\uC2F1\uC744 \uD65C\uC131\uD654\uD558\uBA74 \uB300\uB7C9\uC758 \uADF8\uB9AC\uAE30 \uB0B4\uC6A9\uC774 \uC788\uC744 \uB54C \uADF8\uB9AC\uAE30 \uC131\uB2A5\uC774 \uD5A5\uC0C1\uB418\uACE0, \uCE90\uC2F1\uC744 \uBE44\uD65C\uC131\uD654\uD558\uBA74 \uCE94\uBC84\uC2A4 \uC120\uBA85\uB3C4\uAC00 \uD5A5\uC0C1\uB429\uB2C8\uB2E4.",
      line4: "\uC548\uB0B4\uC120 \uCF1C\uAE30/\uB044\uAE30 \uC9C0\uC6D0",
    },
    BorderConfig: {
      line1:
        "\uC67C\uCABD \uD558\uB2E8 \uBC84\uD2BC\uC740 \uD604\uC7AC \uD655\uB300/\uCD95\uC18C \uBE44\uC728\uC744 \uC2E4\uC2DC\uAC04\uC73C\uB85C \uD45C\uC2DC\uD558\uBA70 \uD074\uB9AD\uD558\uBA74 \uD655\uB300/\uCD95\uC18C \uBE44\uC728\uC774 \uC7AC\uC124\uC815\uB429\uB2C8\uB2E4",
      line2:
        "\uC911\uC559\uC758 \uBC84\uD2BC \uBAA9\uB85D\uC740 \uC67C\uCABD\uC5D0\uC11C \uC624\uB978\uCABD\uC73C\uB85C \uC2E4\uD589 \uCDE8\uC18C, \uB2E4\uC2DC \uC2E4\uD589, \uD604\uC7AC \uC120\uD0DD \uD56D\uBAA9 \uBCF5\uC0AC, \uD604\uC7AC \uC120\uD0DD \uD56D\uBAA9 \uC0AD\uC81C, \uD14D\uC2A4\uD2B8 \uADF8\uB9AC\uAE30, \uC774\uBBF8\uC9C0 \uC5C5\uB85C\uB4DC, \uADF8\uB9AC\uAE30 \uC9C0\uC6B0\uAE30, \uC774\uBBF8\uC9C0\uB85C \uC800\uC7A5 \uBC0F \uD30C\uC77C \uBAA9\uB85D \uC5F4\uAE30\uC785\uB2C8\uB2E4",
      line3:
        "PC: \uC2A4\uD398\uC774\uC2A4 \uD0A4\uB97C \uB204\uB978 \uC0C1\uD0DC\uC5D0\uC11C \uC67C\uCABD \uB9C8\uC6B0\uC2A4 \uBC84\uD2BC\uC744 \uD074\uB9AD\uD558\uC5EC \uCE94\uBC84\uC2A4\uB97C \uC774\uB3D9\uD558\uACE0, \uB9C8\uC6B0\uC2A4 \uD720\uC744 \uC2A4\uD06C\uB864\uD558\uC5EC \uCE94\uBC84\uC2A4 \uD655\uB300/\uCD95\uC18C\uB97C \uC2E4\uD604\uD558\uBA70, \uBC31\uC2A4\uD398\uC774\uC2A4 \uD0A4\uB97C \uB20C\uB7EC \uC120\uD0DD\uD55C \uB0B4\uC6A9\uC744 \uC0AD\uC81C\uD558\uACE0, Ctrl + V \uD0A4\uB97C \uB3D9\uC2DC\uC5D0 \uB20C\uB7EC \uD074\uB9BD\uBCF4\uB4DC \uC774\uBBF8\uC9C0\uB97C \uBD99\uC5EC\uB123\uC2B5\uB2C8\uB2E4",
      line4:
        "\uBAA8\uBC14\uC77C: \uB450 \uC190\uAC00\uB77D\uC73C\uB85C \uB204\uB978 \uD6C4 \uCE94\uBC84\uC2A4 \uB4DC\uB798\uADF8 \uBC0F \uD655\uB300/\uCD95\uC18C \uC9C0\uC6D0",
    },
    FileConfig: {
      line1:
        "\uB2E4\uC911 \uD30C\uC77C \uAD6C\uC131: \uC5EC\uB7EC \uCE94\uBC84\uC2A4 \uC804\uD658 \uC9C0\uC6D0, \uAC01 \uCE94\uBC84\uC2A4\uB294 \uC0AC\uC6A9\uC790 \uC815\uC758 \uC81C\uBAA9, \uCD94\uAC00, \uC0AD\uC81C\uAC00 \uAC00\uB2A5\uD558\uBA70 \uC5C5\uB85C\uB4DC \uBC0F \uB2E4\uC6B4\uB85C\uB4DC \uC81C\uACF5",
    },
  },
  Ii = {
    title: "\uB0B4\uC6A9\uC744 \uC9C0\uC6B0\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?",
  },
  Ti = {
    title:
      "\uD604\uC7AC \uD30C\uC77C\uC744 \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?",
  },
  Pi = {
    uploadFileFail:
      "\uC5C5\uB85C\uB4DC \uC2E4\uD328, \uB2E4\uC2DC \uC2DC\uB3C4\uD574 \uC8FC\uC138\uC694",
  },
  Ri = {
    Sepia: "\uC138\uD53C\uC544",
    Invert: "\uBC18\uC804",
    BlackWhite: "\uD751\uBC31",
    Grayscale: "\uADF8\uB808\uC774\uC2A4\uCF00\uC77C",
    Blur: "\uD750\uB9BC",
    Vintage: "\uBE48\uD2F0\uC9C0",
    BlendColor: "\uC0C9\uC0C1 \uBE14\uB80C\uB4DC",
    Brownie: "\uBE0C\uB77C\uC6B0\uB2C8",
    Kodachrome: "\uCF54\uB2E4\uD06C\uB86C",
    Pixelate: "\uD53D\uC140\uD654",
    Polaroid: "\uD3F4\uB77C\uB85C\uC774\uB4DC",
    Technicolor: "\uD14C\uD06C\uB2C8\uCEEC\uB7EC",
    Brightness: "\uBC1D\uAE30",
    Noise: "\uB178\uC774\uC988",
    Convolute: "\uC5E0\uBCF4\uC2F1",
  },
  Ni = {
    bold: "\uAD75\uAC8C",
    italic: "\uAE30\uC6B8\uC784",
    underLine: "\uBC11\uC904",
    lineThrough: "\uCDE8\uC18C\uC120",
  },
  Ai = {
    cacheTip:
      "\uB300\uB7C9\uC758 \uADF8\uB9AC\uAE30 \uB0B4\uC6A9\uC774 \uC788\uC744 \uB54C \uCE90\uC2F1\uC744 \uD65C\uC131\uD654\uD558\uBA74 \uADF8\uB9AC\uAE30 \uC131\uB2A5\uC774 \uD5A5\uC0C1\uB418\uACE0 \uCE90\uC2F1\uC744 \uBE44\uD65C\uC131\uD654\uD558\uBA74 \uCE94\uBC84\uC2A4 \uC120\uBA85\uB3C4\uAC00 \uD5A5\uC0C1\uB429\uB2C8\uB2E4.",
  },
  Oi = {
    tip: "\uC790\uC720\uB86D\uAC8C \uADF8\uB824\uBCF4\uC138\uC694...",
    loading:
      "\uB370\uC774\uD130 \uB85C\uB529 \uC911\uC785\uB2C8\uB2E4. \uC7A0\uC2DC\uB9CC \uAE30\uB2E4\uB824\uC8FC\uC138\uC694...",
    error:
      "\uBB38\uC81C\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4. \uB098\uC911\uC5D0 \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.",
  },
  _i = {
    removeBackground: "\uBC30\uACBD \uC81C\uAC70",
    removeBackgroundGpuTip:
      "\uC774 \uBE0C\uB77C\uC6B0\uC800\uC5D0\uC11C\uB294 WebGPU\uAC00 \uC9C0\uC6D0\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4. \uBC30\uACBD \uC81C\uAC70 \uAE30\uB2A5\uC744 \uC0AC\uC6A9\uD558\uB824\uBA74 \uCD5C\uC2E0 \uBC84\uC804\uC758 Google Chrome\uC744 \uC0AC\uC6A9\uD558\uC138\uC694",
    removeBackgroundLoading:
      "\uBC30\uACBD \uC81C\uAC70 \uAE30\uB2A5 \uB85C\uB529 \uC911",
    removeBackgroundFailed:
      "\uBC30\uACBD \uC81C\uAC70 \uAE30\uB2A5 \uB85C\uB4DC \uC2E4\uD328",
    removeBackgroundSuccess:
      "\uBC30\uACBD \uC81C\uAC70 \uAE30\uB2A5\uC774 \uC131\uACF5\uC801\uC73C\uB85C \uB85C\uB4DC\uB418\uC5C8\uC2B5\uB2C8\uB2E4",
    removeBackgroundProcessing: "\uBC30\uACBD \uC81C\uAC70 \uCC98\uB9AC \uC911",
    removeBackgroundProcessingSuccess:
      "\uBC30\uACBD \uC81C\uAC70 \uCC98\uB9AC \uC131\uACF5",
    restore: "\uBCF5\uC6D0",
    upload: "\uC5C5\uB85C\uB4DC",
    imageSegmentation: "\uC774\uBBF8\uC9C0 \uBD84\uD560",
    clearPoints: "\uD3EC\uC778\uD2B8 \uC9C0\uC6B0\uAE30",
    imageSegmentationLoading:
      "\uC774\uBBF8\uC9C0 \uBD84\uD560 \uAE30\uB2A5 \uB85C\uB529 \uC911",
    imageSegmentationFailed:
      "\uC774\uBBF8\uC9C0 \uBD84\uD560 \uAE30\uB2A5 \uB85C\uB4DC \uC2E4\uD328",
    imageSegmentationSuccess:
      "\uC774\uBBF8\uC9C0 \uBD84\uD560 \uAE30\uB2A5\uC774 \uC131\uACF5\uC801\uC73C\uB85C \uB85C\uB4DC\uB418\uC5C8\uC2B5\uB2C8\uB2E4",
    imageSegmentationProcessing: "\uC774\uBBF8\uC9C0 \uCC98\uB9AC \uC911...",
    imageSegmentationProcessed:
      "\uC774\uBBF8\uC9C0\uAC00 \uC131\uACF5\uC801\uC73C\uB85C \uCC98\uB9AC\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uC774\uBBF8\uC9C0\uB97C \uD074\uB9AD\uD558\uC5EC \uD45C\uC2DC\uD560 \uC218 \uC788\uC73C\uBA70 \uB179\uC0C9 \uB9C8\uC2A4\uD06C \uC601\uC5ED\uC774 \uBD84\uD560 \uC601\uC5ED\uC785\uB2C8\uB2E4.",
    imageSegmentationGpuTip:
      "\uC774 \uBE0C\uB77C\uC6B0\uC800\uC5D0\uC11C\uB294 WebGPU\uAC00 \uC9C0\uC6D0\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4. \uC774\uBBF8\uC9C0 \uBD84\uD560 \uAE30\uB2A5\uC744 \uC0AC\uC6A9\uD558\uB824\uBA74 \uCD5C\uC2E0 \uBC84\uC804\uC758 Google Chrome\uC744 \uC0AC\uC6A9\uD558\uC138\uC694.",
    positivePoint: "\uAE0D\uC815\uC801",
    negativePoint: "\uBD80\uC815\uC801",
  },
  Bi = {
    rotate: "\uD68C\uC804",
    scale: "\uD06C\uAE30 \uC870\uC815",
    size: "\uD06C\uAE30",
  },
  Fi = {
    eraser: "\uC9C0\uC6B0\uAC1C",
    erasable: "\uC9C0\uC6B8 \uC218 \uC788\uC74C",
  },
  Di = {
    confirm: wi,
    cancel: xi,
    download: Ci,
    reset: vi,
    tool: bi,
    title: Si,
    canvasSize: yi,
    drawType: ki,
    style: Li,
    operate: Ei,
    info: Mi,
    cleanModal: Ii,
    deleteFileModal: Ti,
    toast: Pi,
    filters: Ri,
    fontStyle: Ni,
    boardConfig: Ai,
    request: Oi,
    uploadImage: _i,
    downloadImage: Bi,
    eraserConfig: Fi,
  },
  Wi = O.getState().language;
tr.use(rr).init({
  resources: {
    en: { translation: ao },
    zh: { translation: Eo },
    "zh-TW": { translation: $o },
    ja: { translation: fi },
    ko: { translation: Di },
  },
  lng: Wi,
});
// {
//   const t = document.createElement("script");
//   (t.textContent = `
//   (function(c,l,a,r,i,t,y){
//     c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
//     t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
//     y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
//   })(window, document, "clarity", "script", "k06rclje17");
//   `),
//     (t.async = !0),
//     document.body.appendChild(t);
// }
ar.createRoot(document.getElementById("root")).render(
  c(nr.StrictMode, { children: c(_s, {}) })
);
